在vue中 v-xxx 的行内属性 我们统称为 vue指令
- v-text = '变量'：相当于原生的innerText，相当于小胡子语法，但是避免了显示小胡子的毛病，标签内的任何文本都会被替换成v-text获取的值
- v-html = '变量'：相当于原生的innerHTML，只在可信任的内容上使用该指令；
- v-show： 后边跟的是一个布尔类型（其他类型会默认转成布尔） true 就是显示；false 就是隐藏，类似于css中的display:none
- v-if： 值为true时，元素显示，值为false时，元素隐藏，默认为true
v-show 与 v-if 的区别：
若 v-if条件判断不成立 则 整个标签都不加载
若 v-show条件判断不成立 则 整个标签都加载 只是被display none了
v-if 有比较大的切换开销 v-show 有比较大的初始加载开销
v-show蕴藏的元素在DOM结构上存在，只是在css上隐藏，而v-if溢出的元素在DOM结构上不存在
- v-else
- v-else-if
v-else和v-else-if与日常使用时对应关系相同，v-else的元素必须和v-if紧挨着使用，否则只有v-if产生效果
- v-for： 使用循环展示标签的，可以用来循环数组、字符串、数字、对象；
v-for = '(值，key) in vue变量'
item和index是自己定义的变量， 两个都写需要加上();
item 代表 数组中的当前项
index 是对应的索引
这两个变量 只能用在当前使用v-for的标签上及其内部
- **v-on: ** 我们一般简写成 @ ：事件绑定，绑定的事件方法为methods中对应的方法
需要注意的是：
methods中要使用的方法不能与data中的属性名冲突，
否则会直接引用data中的数据导致报错，
同时也不能直接将函数写在data中，
因为在data中函数的this指向window，而在methods中this执行vue实例
一般先执行绑定的函数 在执行默认行为； scroll touchmove ... 先执行了默认
事件修饰符
@click.prevent='函数名' 就是阻止了默认行为 （preventDefault）
@click.stop = '函数名' 就是阻止冒泡 (stopPropergation)
@click.once = '函数名' 后边的函数只会执行一次
@click.self = '函数名' 只有点击元素本身才会触发这个函数
@click.capture = '函数名' 控制函数在捕获阶段执行 ele.addEventListener('click',cb,{capture:false})
@click.passive = '函数名' 先执行默认 后执行函数 ele.addEventListener('click',cb,{capture:false,passive:true})//passive:true 优先执行默认
按键修饰符
.enter
v-model 的修饰符
.trim 去掉左右两边的空格
.number(把对应的值使用parseFloat转成数字 能转成功的就转，不能成功 就不转了)
.lazy 没有lazy的时候 vue使用的 input事件更新数据； 加上之后 用的change事件更新的数据
- v-bind:src='变量' 是专门用来处理行内属性的指令（v-bind: 一般简写成 :），可以直接使用单冒号绑定
绑定属性，在冒号后面的属性的引号内可以识别变量
通过该方法绑定类名时需要将类名放入数组或对象中
同时用数组和对象进行绑定只取先绑定的一个
通过该方法绑定style时同样需要将样式放入对象中绑定，同样可以使用数组绑定多个样式变量
- **v-model **= '变量'：相当于把这个变量跟这个表单元素绑定在一起了(value+input)；变量改变表单元素的内容跟着改变，内容改变变量也会跟着更新
- v-slot：插槽
- v-pre： 后边也没有值，告诉vue这个标签及其子标签，都不用vue渲染，可以用来提升vue的编译效率
- v-cloak： 后边没有值 就是为了解决小胡子的显示问题；需要配合css使用；原理其实就是 当vue模板渲染之前，走的是普通的html，这时， 我们写的css样式可以起作用 让元素display none了；当模板渲染完成之后，vue会自动把这个行内属性移除，这是在页面上展示的 就是渲染好的htm了；
<style>
[v-cloak]{
/* 有这个 v-cloak 行内属性的元素 会有这个样式’；； 属性选择器 */
display: none;
}
</style>
- v-once： 后边也没有值，vue对有这个指令的元素，只渲染一次；
