vue 常用指令

vue 常用指令：

v-if ：

<div id="example01">
    <p v-if="male">Male</p>
    <p v-if="female">Female</p>
    <p v-if="age>25">Age:{{age}}</p>
    <p v-if="name.indexOf(‘lin‘)>0">Name:{{name}}</p>
</div>

引号内为条件语句，返回一个boolean值，绑定了v-if的元素会根据条件语句中的bool值判断是否渲染，如果否，则dom树中将移除该元素。

v-else/v-else-if

与正常的语法相同，但该指令只能跟在绑定了v-if 的元素后，否则无法识别。

v-show ：

<div v-show = ‘‘></div>

与 v-if 效果用法几乎相同，但绑定了v-show的元素，在后面Boolean值为假时，不会渲染该元素，但该元素仍在dom中，会被添加一句display:none 的代码。效果完全相同

v-for ： 循环指令。类似于js中的遍历

v-for = ‘item in items‘ 

其中item是数组元素，items是数组 可以在computed中进行数组筛选。

v-bind ：绑定html属性，用于动态更新。几乎所有的属性都可以绑定，常用语样式更新。甚至可以拼接字符串，做三目判断等等，引号内的是一个js表达式，返回一个结果作为bind的绑定依据。由于十分常用，简写为‘:’

v-on : 用于绑定事件，引号内绑定的事件要在methods中进行声明。十分常用，简写为‘@’

@click = ‘methods‘

v-once 只将元素渲染一次 ，无参数指令

<p v-once>{{****}}</p>

vue 常用指令

原文：https://www.cnblogs.com/advanceHL/p/11209770.html