Vue常用的指令

Vue常用的指令

变量的输出
v-html 和 v-text
如图上：v-text是原样输出 v-html可以解析html标签

v-bind:属性名=“变量” 可简写成 :属性名=“变量”

如果在vue实例的data数据中需要输出的变量是属性则用v-bind来绑定也可以简写成
：属性=“变量”

v-for 循环遍历输出数据

如果data中的数据是一个数组或者对象，要你渲染到页面上，则循环遍历就ok了 （v-for循环的是li）
如果v-for写进ul里面则循环每次都会执行渲染一个ul

v-model 双向数据绑定
Vue 实现 双向数据绑定 主要采用：数据劫持结合“发布-订阅”模式的方式，通过Object.defineProperty（）的 set 和 get，在数据变动时发布消息给订阅者触发监听
事件的绑定 v-on:事件名=“方法名” 简写 @事件名=“方法名”
（vue的事件就是原声js除去on）
方法写在methods里面

数据的显示 v-if 和 v-show
v-if条件为真渲染元素 条件为假删除元素 所有具有更高的切换成本
v-show渲染所有的元素 不符合条件的数据添加属性style=“display:none” 所以具有更高的渲染成本

条件为真都是显示元素 条件为假 v-if 是删除元素 v-show 是隐藏元素