vue小记

vue的两个核心点
1.响应的数据变化
当数据发生变化----视图自动更新
2.组合的视图组件
UI页面映射为组件树
划分组件可维护、可复用、可测试

mustache 语法糖 {{ }}
几乎所有js类型都是支持的，除了null与undefine数据类型
挂载在window身上的全局属性我们都不能用，比如：console/alert
{{ }} 不写流程控制 for / if /while /do while
{{ }} 支持三元表达式，同样也支持运算符
短路原则也是支持的

指令
指令的目的是做什么：操作DOM
解释：MVVM vm->v 数据驱动
所以：我们要直接操作数据，数据要想操作
v-html：转义输出，也就是可以解析xml数据
v-text：非转义输出，也就是无法解析xml类型数据
v-bind：将数据和属性进行单项数据绑定：将vue中数据赋值给属性值

```html
<img v-bind:src = "src" />
 <div v-bind:class = "">
     
 </div>
 <div v-bind:style = "">
     
 </div>
 ```
  v-bind简写形式
 ```html
 <img v-bind:src="src" alt="">
 <img :src="src" alt="">
 ```
      v-bind类名绑定
     - 对象形式用法

     ```html
         <p :class = "{ bg: true,size: true }"></p>
         <p :class = "{ bg: true,size: false }"></p>
         <p :class = "{ [classA]: true,[classB]: true }"></p>
     ```

   - 数组形式用法

     ```html
         <p :class = "[ 'size','bg' ]"></p>
         <p :class = "[ classA,classB ]"></p>
         <p :class = "[ classA,classB,5>3?'a':'b']">  </p>
     ```