Vue核心(一)
一、初始Vue
1、想让Vue工作，就必须创建一个Vue实例，且要传入一个配置对象
2、app容器里的代码依然符合html规范，只不过混入了一些特殊的vue语法
3、app容器里面的代码被称为Vue模板
4、vue实例和容器是 一 一对应的
5、 真实开发中只有一个vue实例，并且会配合着组件一起使用
6、{{xxx}}中的xxx要写成js表达式，且xxx可以自动读取到data中的所有属性
7、一旦data中的数据发生改变，那么模板中用到该数据的地方也会自动更新(响应式数据)
注意区分: js表达式和js代码
1、表达式: 一个表达式会生成一个值，可以放在任何一个需要值的地方
javascript
（1） a
（2）a + b
（3）demo(1)
（4）x === y ？'a' : 'b'2、js代码
javascript
（1）if() {}
（2）for() {}二、模板语法
2.1 插值语法
功能: 用于解析标签体内容
语法: {{xxx}} xxx是js表达式，且可以直接读取到data中的所有属性
2.2 指令语法
功能: 用于解析标签(包括标签属性、标签体内容、绑定事件等等)
举例: v-bind:href="xxx" / :key="xxx" xxx同样要写js表达式，且可以直接读取到data中的所有属性
备注: vue中有很多的指令，且形式都是v-xxx(例如v-bind、v-if、v-model、v-on等等)
三、数据绑定
特点:
1、单向绑定(v-bind): 数据只能从data流向页面
2、双向绑定(v-model): 数据不仅能从data流向页面，还可以从页面流向data
注意:
a, 双向绑定一般都应用在表单元素上(例如input、select等)
b, v-model:value 可以简写为v-model， 因为v-model默认收集的就是value值
四、data与el的两种写法
· el的两种写法
（1）new Vue时配置el属性
（2）先创建Vue实例，随后再通过vm.$mount("#xxx")指定el的值
· data的两种写法
（1）对象式
（2）函数式(在组件中必须使用函数式)
· 一个重要原则:
由Vue管理的函数, 一定不要写箭头函数，一旦写了箭头函数，this就不再是Veu实例，而是window(全局对象)
五、MVVM模型
定义: M(model-模型)：对应data中的数据； v(view-视图): 模板； VM(vm-ViewModel)：Vue实例对象
特点:
a, data中所有的属性，最后都出现在vm身上
b, vm身上所有的属性及Vue原型上的所有属性，在Vue模板中都可以直接使用