VUE指令（二）

vue会根据不同的指令，针对不同的标签实现不同的功能。指令是带有 v- 前缀的特殊标签属性。指令的职责是，当表达式的值改变时，将其产生的连带影响，响应式地作用于 DOM。

        8、v-for：基于数据循环，多次渲染整个元素（数组、对象、数字等），v-for = "(item--每一项, index--下标) in 数组"   key = "唯一标识" ，若不需要下标，可使用 v-for = "item in 数组"，key是给列表添加的唯一标识，只能是唯一的字符串或数字，便于vue进行列表项的正确排序及复用；

<ul><li v-for="(item, index) in list" :key="index">{{ item }} - {{ index }}</li>
</ul>data: {list: ['西瓜', '苹果', '鸭梨', '榴莲']
}

        9、v-model：给表单元素使用， 实现双向数据绑定，可以快速获取或设置表单元素内容，v-model = '变量；

账户：<input type="text" v-model="username"> <br><br>
密码：<input type="password" v-model="password"> <br><br>
<button @click="login">登录</button>data: {username: '',password: ''
},methods: {login () {console.log(this.username, this.password)},
}

• .lazy- 监听 change 事件而不是 input
• .number- 将输入的合法字符串转为数字
• .trim- 移除输入内容两端空格

         10、v-slot：声明具名插槽或是期望接收 props 的作用域插槽；

         11、v-pre：跳过该元素及其所有子元素的编译；        

         12、v-once：仅渲染元素和组件一次，并跳过之后的更新；