概念：
在学习vue指令之前，我们要先明白，所有的vue指令本质上都是对dom操作的封装，另外，如果指令有值，那么这个值即是响应式变量，也是表达式
基本指令：
文本类指令
Mustache语法：
{{message}}
Mustache语法也叫文本插值也叫双大括号语法，里面可以写变量，表达式等。 {{}}的缺点是刷新页面时会出现‘一闪而过’的效果，解决办法可以用v-text代替或者使用v-cloak(注意v-cloak没有值)加display:none代替。
v-text：
v-text专门用于文本类的声明式变量，比如字符串，数值等，如果渲染的变量是布尔值，默认会进行隐式转换，转换成对应的字符串，如果变量是null或者undefined，则不进行渲染，v-text相当于原生的innerHTML。
v-html：
v-html 专门用于渲染html字符串，也就是说如果声明式变量是一个html字符串，vue默认是不会渲染的，而是会当成普通字符串，该显示啥就显示啥，当加上v-html， vue就会识别，比如将字符串'百度'识别成a标签。
v-once
对应的声明变量只会渲染一次，再次更改时试图不会更新(后面没有值)
动态指令
v-bind:
v-bind用来动态绑定元素的属性，几乎所有的属性都可以动态绑定，在实际开发中主要用来动态绑定style和class。绑定方式有数组语法和对象语法。
事件指令
v-on：
语法糖： @ v-on用来绑定事件，有几个修饰符： .prevent 阻止默认行为 .stop 阻止事件冒泡 .enter 键盘事件时，同时使用多个修饰符时可以链式调用 事件不传参时，默认参数是事件对象，如果事件需要传参，则要用函数调用的方式传入所需的参数，如果同时还要传入事件对象，则需要手动传入$event
不需要传参:
<tag @click="handler"> </tag>
需要传参：
<tag @click="handler(1,2,$event)"> </tag>
表单绑定
v-model：
表单的双向绑定， 背后原理是v-bind绑定对应声明变量的值，change事件传入事件对象绑定表单的是值， 修饰符： .lazy等表单输入完页面再更新，.number限制只输入数字，.trim去除表单value值头尾的空格
循环列表
v-for
v-for用来循环数组，数字，对象，以及一切可迭代的对象
v-for="(item,index) in list"
- 循环数组： index从0开始
- 循环数字： index从1开始，直到这个数字
- 循环对象 index从0开始
v-for="(value,key,index) in obj" //循环对象第一个是值，第二个是键，第三个是索引
条件渲染
v-show:
v-show后面的条件为true时显示对应的元素，反之隐藏，本质是从css层面使用display:none对元素进行显示和隐藏
v-if/v-else-if/v-else
同样，当v-if/v-else-if后面的条件为true才对元素进行显示，否则隐藏，但是v-if/else的本质是从DOM层面对元素进行显示与隐藏，当条件为false时，vue根本不会渲染dom元素。(v-if是惰性的)
对比：v-show的 v-for用来循环数组，数字，对象，以及一切可迭代的对象，v-if的切换性能开销比较大当一个元素需要频繁进行显示与隐藏时，建议使用v-show，否则使用v-if
其他指令：
v-pre
不常用，主要用：来调试
v-slot：
组件化开发时使用
总结
vue基本指令包括：
-
文本类指令： {{}}、v-text、v-html、v-once四个
-
动态指令： v-bind
-
事件绑定指令： v-on
-
表单双向绑定指令： v-model
-
条件渲染指令： v-show、v-if/v-else-if/v-else
-
其他指令： v-pre、v-slot。
