前言：
别想一下造出大海，必须先由小河川开始
--------------------------------正文---------------------------------
MVC (设计模式)
作用: view和modle分离
好处：解决耦合问题
防止混乱
VueJS（官网 https://cn.vuejs.org/）
MVVM框架（双向绑定）
插件:(专注于某一个效果)
库:(人是主导，操作对像、DOM)（react应该是一个UI库）
框架:(框架是主导，操作数据)
下载
1. 直接下载vue.js文件
2. 使用vue-cli
格式：
new Vue({
el:'#box',
data:{
aProduct:[]
},
filters:{
cur:function(value){
return ;
}
},
computed:{
aRro:function(){
return this.aProduct.reverse();（反转）
}
},
methods:{
send(){
}
}
});
指令 v-开头
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-cloak] {
display: none;
} // 写在style里面
// 一起使用
简写
v-bind
v-bind:href :href
v-bind:src :src
v-bind:key :key
v-on
v-on:click @click
v-on:keydown @keydown
生命周期钩子
beforeCreate 创建前
created 创建后
beforeMount 挂载前
mounted 挂载后
beforeUpdate 数据更新前
updated 数据更新后
beforeDestroy 销毁前
destroyed 销毁后
自定义指令
Vue.directive('指令名',function(el){
当前对象
coding....
});
事件深入
@click.prevent.stop（阻止默认、阻止冒泡）
@keydown.enter.ctrl（enter键）
自定义按键
Vue.config.keyCodes.xxx = 键码;
过滤器 filter
1、文本过滤器
filters: {
xxx: function(arg1,arg2...){
return 处理后的结果;
}
}
{{message:xxx(xxx,xx,xx..)}}
2、数据过滤器
computed: {
xxx: function(arg1,arg2,arg3){
操作
返回
}
}
v-for="item in xxx"
computed 计算属性
computed第一次调用一个函数，会解析一次数据，然后会有缓存，如果下次还调用这个函数，就不解析数据了，直接用缓存的数据，会提高性能。
methods第一次调用一个函数，会解析一次数据，如果下次还调用这个函数，就还会解析一次数据，调用几次，解析几次。
相比较methods，更加节省性能。适合用于重复渲染，逻辑复杂的计算。
computed: {
xxx: function(){
操作
return ;
}
}
