最近公司开发新的项目，前端框架选定vue，对于前端小白的我，需要自己学习补充能量。
vue的最大特点：响应的数据绑定、组合的视图组件。
vue文件里面包含三种：<template>html模板</template> <script>js</script> <style>css<style>
webpack 将vue的文件打包成浏览器能识别的 html（视图层）、js(就是一个vue对象，model数据层在这里)、css
全局安装vue的环境：
npm install -g vue-cli(可以在命令行vue命令)
vue init webpack vueTest(创建一个基于webpack模板的vue的新项目，项目名称为：vueTest)
npm install -d(将项目中package.json中的依赖的包下载到vueTest)
npm run dev(启动环境，在package.json中的"scripts": "dev": "node build/dev-server.js",所以启动只需要npm run dev 就好，在浏览器中可以浏览该项目：http://localhost:8080)如下图所示：可以实时监控，当你修改了js，页面就会实时输出对应的内容
vue.js重要的组件:
1:data:数据
2：method：方法
3：watch：监听
4：el:绑定的对象
vue的数据渲染：
三种形式：{{}}、v-text、v-html效果上没有多大的区别。
当Vue中的a发生变化，上面的a也会相对应发生变化，响应式的数据绑定。
常用的指令：
控制模块隐藏：v-if、v-show
渲染循环列表：v-for，就会循环出来两个qinbb、mmp
事件绑定：v-on（其中v-on:click和@click是一样的事件绑定）
属性绑定：v-bind，这个一般绑定的是class属性，所以v-bind会省略，其中imageSrc是字符串，第三个p中的classA和classB也是字符串，{red:isRed}这个是对象，is说明是个布尔值。
总结：
new一个vue对象，主要包含了三个重要的属性data（vue对象的数据相当于model）、method（vue对象的方法）、watch（vue对象的事件监听）
模板指令将视图层（html）和逻辑层（data）连接起来，常用的模板指令：
v-if（v-show）:判断指令
v-text（v-html、{{}}）:模板渲染
v-for:循环指令
v-on:事件绑定