vue总结(2)

目录

1. computed计算
2. watch监听
3. directives自定义指令
4. 事件指令

computed计算

从现有数据计算出新的数据

computed:{
rmsg(){return  this.msg.split('').reverse().join('')}
}

watch监听

监听数据的变化，并执行回调函数handler

watch:{
"num":{
handler(nval,oval){},
deep:true
}
}

directives自定义指令

• bind绑定执行一次

• insert插入执行一次

• update每更新执行一次

   directives:{
   "v-focus":{
   update(el,binding){
   if(binding.value){el.focus()}
   }
   }
   }
  

事件指令

• v-on:事件类型=“响应函数”
  v-on:click=“say()”
• @click=“say()”
  事件的简写
• @click=“num++”
  行内事件响应
• 事件修饰符
  .stop阻止事件冒泡
  .prevent阻止默认事件
  .once只执行一次
  @click.stop.once.prevent="num++"
  事件的修饰符可以同时写多个
• 按键修饰符
  1.up
  2.down
  3.left
  4.right
  5.delete
  6.enter
  7.space
  8.esc
• 事件对象
  $event