首页 > 技术文章 > VUE常见指令

zhuxiaopijingjing 2020-04-08 10:31 原文

1.v-text    
该指令可以渲染文本   在标签属性位置上写上   v-text ="属性名"   
   和插值表达式区别是   插值表达式 卸载innerHTML位置    v-text 写在标签属性位置
2.v-html

用来渲染带标签的文本,网站上动态渲染任意的html危险 ,容易受到xss攻击,只在可信内容上使用   v-html  提交的内容不可使用
3.v-bind     

动态绑定属性     例如  <img v-bind:src="url">   url可以在data中获取其中   v-bind可以省略
4.v-for     

用来渲染数组和对象
     1.渲染数组
       在标签属性的位置上写上   v-for ="(item,index) in arr"   :key="index"    //key必须加上 值为一个该数组不重复的项
     2渲染对象
'         在标签属性位置上写上   v-for="(value,key,index)  in obj"    :key="index"
5.v-model       

双向数据绑定model和view中的值进行同步变化
6.v-on

用来监听dom事件
方法   v-on:事件类型   ="执行函数"   执行函数中可以添加参数可以传递$event对象
例子:
 

7.v-if
通过控制dom来控制元素的显示隐藏   
涉及到异步数据渲染的时候就要使用v-if   
8.v-show

通过控制样式 display:none来控制元素的显示和隐藏
涉及到大量dom操作的时候需要使用v-show
9.v-cloak

给闪烁的元素加上v-cloak指令
例子

 








 
 
 

推荐阅读