向Vue进军（二）

1.修饰符(modifiers)

事件修饰符

...


...





...

表单修饰符

2.watch和computed

watch的两种写法

// Method 1
watch:{
  data(newVal,oldVal){
     //  监听属性，属性发生改变即执行函数
  }
}
// Method 2
watch:{
  data:{
     handler(newVal,oldVal){
        //  监听属性，属性发生改变即执行函数
     },
     immediate: true,    // 立即执行handler函数
     deep: true          // 深度监控
  }
}

computed两种写法

// Method 1
computed{
  data(){
    // 定义的时候像个方法，用起来像个属性
  }
}
// Method 2
computed{
   data(){
      get(){
          // 获取值
      },
      set(val){
          // 对计算属性设置值，这个值可以做些其他操作
      } 
}

两者区别

1.watch监听的属性必须在data中声明，而computed属性不能在data中声明
2.watch监听的属性发生变化才会执行对应代码，而computed是根据依赖属性的变化从而重新计算，若依赖属性没有发生变化，则直接从缓存中读取数据，不会重新进行渲染
3.watch里面可以有异步操作，而computed中是不允许的