vue-语法

在底层实现上，vue将模版编译成虚拟dom渲染函数。结合响应系统，vue能够智能地计算出最少需要渲染多少组件，并把DOM操作次数减到最少

模版语法

1.{{}}:普通文本，不能用在元素的属性绑定上
2.v-html：html
注：为防止xss攻击，请注意只对信任的内容使用html插值，不要使用用户提供的内容进行插值

3. v-bind：

<button v-bind:disabled="isButtonDisabled">Button</button>

如果disabled的值为null,undefined,false,disabled属性都不会被渲染出来
4.javascript表达式：可以用在插值表达式，也可用在v-bind中，且只能访问Math和Date
5.修饰符：以半角句号.指明的特殊后缀。用于指出一个指令以特殊方式绑定

computed

计算属性是基于它们的依赖进行缓存的

<div id="example">
  <p>Original message: "{{ message }}"</p>
  <p>1. reversed message: "{{ reversedMessage }}"</p>
  <p>2. reversed message: "{{ reversedMessage() }}"</p>
</div>

var vm = new Vue({
  el: '#example',
  data: {
    message: 'Hello'
  },
  computed: {
    // 计算属性的 getter
    reversedMessage1: function () {
      return this.message.split('').reverse().join('')
    },
  reversedMessage2:{
      cache:false,
      get:function(){
            return this.message.split('').reverse().join('')
      }
      
    }
  }
})

上述例子中，1和2的结果是完全相同的，不同的是用2取值，每次都会重新执行函数获取结果，而使用1结果会被缓存，也就是说在message不改变的情况下，多次执行reversedMessage，都会取第一次的结果
所以根据使用场景是否需要缓存，来决定用1还是2，使用方法的方式，也可以达到效果，不会有缓存
想要缓存，用计算属性，不要缓存将cache设置为false或者用方法

watch

当需要在数据变化时执行异步或开销较大的操作时可以使用watch

class

class和style的绑定也是用v-bind或者：,vuejs对此做了专门的增强，表达式结果的类型除了字符串之外，还可以是对象或者数组

6/100
效率还需要提高。
每天中午醒来时，总是觉得没劲不想工作，一种很丧的感觉。在写作中慢慢静下来，其实，每天有一点收获的感觉很好！