vue中的指令是指什么？

在表现形式上，就是带有’v-'前缀的属性。v-属性名=‘具体表达式’。当表达式对应的值发生变化后，将响应式的作用于Dom，从而影响视图层。更为具体的说，指令结合属性作为暗号，框架会根据按照对应的不同的值来进行Dom操作的绑定。因此，帮我们在实际开发中做了减法。

2.vue中常用的指令

（1）v-text

v-text=‘msg1’，msg1被定义在数据属性中，指明了具体的值。将具体的值展示在视图层，对应javascript中的innerText属性。同时，其作用又与模板语法{{具体的数据属性名}}类似。因此一般较为少用

（2）v-html

v-html=‘msg2’，msg2被定义在数据属性中，指明了具体的html内容。对应javascript中的innerHtml属性。

（3）v-if与v-else

v-html=‘msg3’，msg3被定义在数据属性中，若msg3对应的值为true，则使用v-if的盒子会显示在页面中；否则，该盒子不会显示在页面中。v-if控制了页面元素的显示与否。但是v-if是实实在在的控制页面中元素的存在与否，相当于对appendChild和removeChild的使用。如果要反复控制页面元素显示与否，则不建议使用v-if和v-else，因为会降低页面的性能。需要注意的是当使用了v-if=‘true’的元素显示的时候，则使用v-else的元素不会显示；当使用了v-if=‘false’的元素不显示时，则使用了v-else的元素会显示。

（4）v-show

v-show=‘msg4’,msg4被定义在数据属性中。与v-if在功能上类似，若msg4对应的值为true则所在元素会在页面上显示；否则，所在元素不显示于页面。但v-show与v-if的区别在于v-show是通过控制display:none/block来控制元素的显示与隐藏的。因此，v-show常用在页面元素需要频繁显示与隐藏的场景之下。

（5）v-bind

v-bind:标签属性/自定义属性=‘msg5’，msg5被定义在数据属性中。v-bind被用来绑定元素的属性，即可以绑定标签自带的属性，也可以绑定自定义的属性。其对应的缩写形式为：标签属性/自定义属性=‘msg5’。

（6）v-on

v-on:原生事件名=‘method1’，method1被定义在methods中。v-on被用来绑定事件。其缩写形式为：@原生事件名=‘method1’。

（7）v-for

v-for=‘(item,index)inarray1’或v-for=’(value,key)inobj1’可以用来遍历数组和对象，并将数组和对象对应的值显示在视图层

3.vue中常用指令的具体使用

（1）详细代码如下所示