Vue.js

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

你可能感兴趣的:(Vue.js)