VUE-指令-文本体系
▲内容:v-text:渲染纯文本 v-html:渲染超文本
//▲v-once(值只渲染一次,只如果改变,不会跟着改变,绑定model也不会跟着改变)
▲显隐:(接收布尔值)
v-show:基于css控制 适用于频繁操作中
v-if:基于渲染控制 适用于不频繁操作中,if操作更为安全:false整个节点显示一起删掉(可在浏览器中观察)
//alt+shift+方向键:复制相同的内容
VUE-指令-分支系
▲分支:(接收布尔值)
v-if(判断) v-else-if(分支) v-else(分支)
if else if else 如果凑成一个分支,那么相关的dom一定挨着写
▲列表:v-for:(for循环)
基本语法和嵌套语法如下:
//item:形参,遍历数组中的每一个元素。
//index:代表遍历元素对应的下标。
//in之后的代表遍历的数组对象。
//key存在的意义是为了每一个循环出来的元素添加唯一标识符,提高更新效率
//数组语法
v-for="(item,index) in arr" :key="index"
//对象语法
v-for="(value,key) in job" :key="key"
//嵌套语法中,内部可以使用外部获取信息
VUE-指令-数据绑定
▲数据绑定:v-model:将数据和视图实现双向绑定;
实际应用:数据绑定单层/多层
v-model在复选框中两种表现状态:
1.绑定非数据组时:会收集当前复选框中的状态。
2.绑定数组时:会收集复选框中的value值。
▲v-bind动态绑定属性值
v-bind:href=" "
▲v-on绑定事件
v-on:click=" "
v-on:blur=" "