MVC
设计模式
作用:view和modle分离
VueJS
MVVM框架
指令
v-model 数据绑定
v-on 添加事件
v-bind 绑定属性
v-for 循环、迭代 建议使用v-for的时候设置v-bind:key
v-text 纯文本
v-html html
v-show 是否显示
v-pre 跳过编译
v-cloak 防止闪屏
简写
v-bind :xxx
v-on @xxx
声明周期钩子
beforeCreate 创建前
created 创建后
beforeMount 挂载前
mouted 挂载后
beforeUpdate 数据更新前
updated 数据更新后
beforeDestroy 销毁前
destoryed 销毁后
自定义指令
Vue.directive('指令名',function(el){
当前对象
coding....
});
事件深入玩法
@click.prevent.stop
@keydown.enter.ctrl
自定义建码
Vue.config.keyCodes.xxx = 键码;
过滤器
文本过滤器
filters: {
xxx: function(arg1,arg2...){
return 处理后的结果;
}
}
{{message:xxx(xxx,xx,xx..)}}
数据过滤器
数据过滤器
computed: {
xxx: function(arg1,arg2,arg3){
操作
返回
}
}
v-for="item in xxx"
computed 计算属性
相比较methods,更加节省性能。适合用于重复渲染,逻辑复杂的计算。
computed: {
xxx: function(){
操作
return ;
} |