一、指令 (v-开头)
v-model 数据绑定
v-on 添加事件
v-bind 绑定属性
v-for 循环、迭代
v-text 纯文本
v-html html
v-show 是否显示
v-pre 跳过编译
v-cloak 防止闪屏
建议使用v-for的时候设置v-bind:key。
二、指令简写
v-on
v-on:click @click
v-on:keydown @keydown
v-bind
v-bind:href :href
v-bind:src :src
v-bind:key :key
三、自定义指令
1.全局自定义指令
Vue.directive('指令名',function(el){
el指当前对象
coding....
});
2.局部自定义指令
directives: {
focus: {
// 指令的定义
inserted: function (el) {
el.focus()
}
}
}
四、生命周期钩子
beforeCreate 创建前
created 创建后
beforeMount 挂载前
mouted 挂载后
beforeUpdate 数据更新前
updated 数据更新后
beforeDestroy 销毁前
destoryed 销毁后
五、过滤器 filter
a.文本过滤器
filters:{
curr:function(value){
if(value){
return '¥'+value;
}
}
}
{{item.price*item.count|curr}}
b.数据过滤器
orderByP(){
return this.aProduct.reverse();
}
相比较methods,更加节省性能。适合用于重复渲染,逻辑复杂的计算。