2017.11.27

MVC 设计模式 作用： view 和model分离

VueJS

下载 1 直接下载vue.js的文件2使用vue-cli

指令

v-model        数据绑定
v-for             循环、迭代
v-bind          绑定属性
v-on             添加事件
v-text           纯文本
v-html          html
v-cloak        防止闪屏
v-pre           跳过编译

简写

@click
@keydown
:href
:src
:key

生命周期钩子

beforeCreate     创建前
created          创建后
beforeMount      挂载前
mounted          挂载后
beforeUpdate     数据更新前
updated         数据更新后
beforeDestroy    销毁前
destroyed        销毁后

自定义指令

vue.directive('指令名',function(el){
                当前对象
                coding...
          });

事件深入玩法

    @click.prevent.stop

    @keydown.enter.ctrl

    自定义按键

    Vue.config.keyCodes.xxx = 键码;

过滤器 filter

文本过滤器

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 ;
        }
    }

组件 Component

路由 Router（SPA）

过渡 transition

数据交互 (axios、vue-resouce...等三方)

状态管理 VueX

脚手架 Vue-cli