vue.js总结---（2）指令

vue指令
1、插值表达式：{{}}
注意：不能在属性节点中使用，只能在内容节点中使用
2、v-cloak
解决插值表达式闪烁问题

{{msg}}

style里需要设置：display：none； 应用场景：网络比较卡时候可以在最外层的元素添加v-cloak，防止客户看到插值表达式 3、v-text（用在属性节点上） 用法：

与差值表达式区别： ①没有闪烁问题 ②存在覆盖内容问题 4、v-html （用在属性节点上） 用法：

5、v-bind（属性节点动态绑定数据） 用法：按钮 简写：按钮 通过v-bind设置样式： ①样式：.red{color:red} .thin{font-weight:200px} ②

啦啦啦~

6、v-on （事件绑定）： 用法: 结构：按钮 脚本：var vm=new Vue({ el:"#app", data:{}, methods:{ btnClick:function(){ alert('ok') } } }) 简写：@btnClick 7、v-model （实现双向数据绑定，可以把页面中数据的变化，自动同步更新到VM实例的data中） 用法： 总结：和v-bind的区别： ①v-bind只能实现单项数据的数据同步data，v-model可以实现双向的数据同步data，也是唯一支持双向数据绑定的指令； ②v-model只能和表单元素配合使用，例如：input、select、textarea等； 8、v-for 循环 用法：