vue的钩子函数

vue的钩子函数有好几类

一、生命周期钩子函数

　　（1）beforeCreate（）       实例创建前触发

　　（2）created（）                实例创建完成，

　　（3）beforeMount（）        模板渲染前，可以访问数据，模板编译完成，虚拟DOM已经存在

　　（4）mounted（）              模板渲染完成，可以拿到DOM节点和数据

　　（5）beforeUpdate（）      更新前

　　（6）updated（）               更新完成

　　（7）activated（）         　 激活前

　　（8）deactivated（）         激活后

　　（9）beforeDestroy（）　 销毁前

　　（10）destroyed（）　　  销毁后

 

二、自定义指令directives的钩子函数

　　（1）bind（）         绑定指令到元素上，只执行一次。

　　（2）inserted（）   绑定了指令的元素插入到页面中展示时调用，很常用。

　　（3）update（）　 所有组件节点更新时调用

　　（4）componentUpdated    指令所在的节点及其子节点全部更新完成后调用。

　　（5）unbind（）    解除指令和元素的绑定，只执行一次。

 

 

三、路由导航 / 路由守卫  钩子函数

　　（1）全局守卫

　　　　①前置：router.beforeEach（(to,from,next)=>{  }）

　　　　②后置：router.afterEach（(to,from)=>{  }）

　　（2）路由独享守卫

　　　　beforeEnter:（to,from,next)=>{   }

　　（3）导航守卫

　　　　①beforeRouteEnter（to,from,next）{   }

　　　　②beforeRouteLeave（to,from,next）{  }

 

广义上来说，watch、computed这些也属于钩子函数，watch是在监控的数据变化时就会自动执行对应的方法，而computed是在数据变化时再次计算数据。