Vue.js---指令与事件、语法糖
指令与事件 指令(Directives)是Vue.js模板中最常用的一项功能,它带有前缀v-,指令的职责就是当其表达式的值改变时,相应地将某些行为应用到DOM上。 v-if: 显示这段文本 当数据show的值为true时,p元素会被插入,为false时则会被移除。数据驱动DOM是Vue.js的核心理念,所以不到万不得已时不要主动操作DOM,只需要维护好数据,DOM事Vue会帮我们处理。 v-bind: v-bind的基本用途是动态更新HTML元素上的属性,比如id、class等。 链接地址与图片的地址都与数据进行了绑定,当通过各种方式改变数据时,链接和图片都会自动更新。 v-on: v-on用来绑定事件监听器。 这是一段文本 点击隐藏 在button按钮上,使用v-on:click给该元素绑定了一个点击事件,在普通元素上,v-on可以监听原生的DOM事件,除了click外,还有dblclick、keyup、mousemove等。表达式可以是一个方法名,这些方法都写在Vue实例的methods属性内,并且是函数的形式,函数内的this指向的是当前Vue实例本身,因此可以使用this.xxx的形式访问或修改数据。 Vue.js将methods里的方法也代理了,所以也可以像访问Vue数据那样来调用方法: 这是一段文本