vue各种指令总结

2018-09-06  本文已影响0人  雨后晴阳

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指令

例子

   

上一篇 下一篇

猜你喜欢

热点阅读