vue的指令v-

v-cloak：

<style>
            [v-cloak]{
                display: none;
            }
</style>
<div id="app" >
	<p v-cloak>{{}}</p>
</div>

注：渲染页面前会先加载vue.js，加载或多或少都会有时间。在没加载之前，如果不用这个指令，那么就会显示出一些代码而不是值，当加载完成后才会显示结果，这个问题称之为闪烁问题

如果在标签内加上v-clock:，并且在style中添加v-cloak的样式，那么在加载好之前不会显示任何东西，加载后才显示结果，这就是该标签的作用，解决页面闪烁问题。

v-text：

<p v-text="titlemsg">123</p>
<!--该标签显示的内容就只有titlemsg的值而没有123-->

与插值表达式{{ }}一样显示数据

与插值表达式（mustache表达式）的区别：
1、v-text没有页面闪烁问题
2、v-text的值会是元素的全部内容，而插值表达式前后可添加其他内容

v-html

会解析data中html格式，与v-text一样会覆盖元素内容

v-bind

来绑定属性的指令：v-bind:属性名=“值” 缩写是冒号:
值可以是data中的变量，还可以是属性值，还可以写表达式

v-on

来绑定事件的指令 v-on:事件名=“值” 缩写是@

v-model

双向数据绑定 v-model=“值”，只能用于表单元素中
如input(radio,text,address,email),select,checkbox,textarea

v-for

可以循环普通数组、对象数组、对象、迭代数字
key的使用需要验证------

<p v-for="(item,i) in list1" :key="item">索引值是{{i}}---值是{{item}}</p>
list1:[1,2,3,4,5]

<p v-for="(item2,i) in list2" :key="item2.id">索引值是{{i}}--id是{{itme2.id}}--name是{{item2.name}}</p>
list2:[{id:1,name:'一'},{id:2,name:'二'},{id:3,name:'三'},{id:4,name:'四'}]

<p v-for="(val,key,i) in list3" :key="i">值是{{val}}--键是{{key}}--索引是{{i}}</p>
list3:{id:1,name:"wang":sex:"女"}

<p v-for="count in 10" :key="count">这是第 {{count}} 次循环  </p>
count从1开始

循环数组，对象，迭代数字
一般都与key一起使用
key属性值只能是number/string
key必须用v-bind

v-if

v-if=“true/false” 根据值来判断是否创建这个元素，是就创建，不是就删除，所以如果值频繁变化则不建议使用该指令，会有较多的切换性能消耗

v-show

v-show=“true/false” 根据值来判断是否显示这个元素，是就显示，不是就隐藏，该指令的元素一定会创建。