Vue的生命周期以及事件修饰符,过滤器

101 阅读1分钟

生命周期

activated

  keep-alive 组件激活时调用。该钩子在服务器端渲染期间不被调用。

deactivated

  beforeCreate  //在创建对象之前,监控数据变化和初始化事件之前调用
  created  //实例创建完成之后调用,挂载阶段还没有开始
  beforeMount //开始挂载的时候执行,这时html还没有渲染到页面上
  mounted  //挂载完成,也就是模板中的heml渲染到了页面中,此时可以做一些ajax的操作,这个钩子函数只会执行一次
  beforeUpdate  //数据更新之前调用
  updated  //数据更新之后调用
  beforedestroy  //数据销毁之前
  destroyed //数据销毁之后

事件修饰符

.stop:  event.stopPropagation() 阻止事件冒泡
.prevent   event.preventDefault() 阻止事件默认行为
.capture  : 捕获
.self   : 只有当该元素是事件本身时触发回调
.once  : 只会触发一次

过滤器

全局 Vue.filter

    Vue.filter('time',function(val,val1,val2){
       console.log(val,val1,val2);
       // return '¥'+val.toFixed(2)
    })

局部 filters

 <el-table-column label="时间">
    <template slot-scope="scope">
        {{ scope.row.add_time | times }}
    </template>
 </el-table-column>
     
  filters: {
    times(e) {
      return e;  //return 是必须返回值
    },
  },