vue_指令与事件

vue_指令与事件

vue的指令通常带有前缀v-,它的主要职责是当其表达式的值改变时，相应地将某些行为应用到DOM上。

v-bind指令

" v-bind指令的基本用途就是动态更新HTML元素上的属性，比如id、class等。 "

代码示例

   
   
   
   



      链接
      

运行结果：

v-bind使用

v-on指令

v-on指令用于绑定事件监听器。
在button按钮上，使用v-on:click 给该元素绑定了一个点击事件，在普通元素上，v-on可以监听原生的DOM事件，除了click外，还有dblclick,keyup,mousemove等。表达式可以是一个方法名，这些方法都写在Vue实例的methods属性内，并且是函数的形式，函数内的this指向的是当前vue实例本身，因此可以直接使用this.xxx的形式来访问或修改数据。

代码示例

    
    
    
    



    
{{msg}}
    点击隐藏

运行结果：

v-on

点击后