创业园区网站建设,做网站用win2008系统,佛山市研发网站建设哪家好,4a级旅游网站建设的要求在进行组件化项目开发的时候都会存在一个组件的生命周期概念#xff0c;像Vue、React、小程序等等#xff0c;无一例外#xff0c;而通常情况组件的生命周期主要分成三个阶段#xff0c;包括#xff1a;创建、更新以及销毁阶段。
Vue的生命周期钩子函数主要包括#xff…在进行组件化项目开发的时候都会存在一个组件的生命周期概念像Vue、React、小程序等等无一例外而通常情况组件的生命周期主要分成三个阶段包括创建、更新以及销毁阶段。
Vue的生命周期钩子函数主要包括
beforeCreate(): 在实例初始化之后调用, data和methods都还没有初始化完成, 通过this不能访问created(): 此时data和methods都已初始化完成, 可以通过this去操作, 可以在此发ajax请求beforeMount(): 模板已经在内存中编译, 但还没有挂载到页面上, 不能通过ref找到对应的标签对象mounted(): 页面已经初始显示, 可以通过ref找到对应的标签, 也可以选择此时发ajax请求beforeUpdate(): 在数据更新之后, 界面更新前调用, 只能访问到原有的界面updated(): 在界面更新之后调用, 此时可以访问最新的界面beforeDestroy(): 实例销毁之前调用, 此时实例仍然可以正常工作destroyed(): Vue 实例销毁后调用, 实例已经无法正常工作了deactivated():组件失活, 但没有死亡activated(): 组件激活, 被复用errorCaptured(): 用于捕获子组件的错误,return false可以阻止错误向上冒泡(传递)
我们通常在created()/mounted()进行发送ajax请求启动定时器等异步任务而在beforeDestory()做收尾工作如: 清除定时器操作。
不过需要注意的是mounted生命周期钩子中并不代表界面已经渲染成功因为 mounted 不会保证所有的子组件也都一起被挂载。如果你希望等到整个视图都渲染完毕可以在 mounted 内部使用 vm.$nextTick。
Vue的生命周期钩子函数又分为了单个组件生命周期、父子组件的生命周期、带缓存的路由组件生命周期等不同的状态在不同的状态下所拥有的生命周期内容是不相同的。 单个组件生命周期 初始化 beforeCreatecreatedbeforeMountmounted 更新 beforeUpdateupdated 销毁 beforeDestroydestroyed 父子组件的生命周期 初始化: beforeCreate created beforeMount –child beforeCreate–child created–child beforeMount–child mounted mounted 更新: beforeUpdate –child beforeUpdate –child updated updated 销毁: beforeDestroy – child beforeDestroy– child destroyed destroyed 带缓存的路由组件生命周期 初始化: … mounted –Child activated activated 路由离开 –Child deactivateddeactivated 路由回来 –Child activatedactivated 捕获子组件错误的勾子 子组件执行抛出错误 errorCaptured
阶段VueReact小程序应用小程序页面创建beforeCreateconstructor()onLaunchonLoadcreatedstatic getDerivedStateFromProps()onShowbeforeMountrender()onReadymountedcomponentDidMount()更新beforeUpdatestatic getDerivedStateFromProps()onShowonShowupdatedshouldComponentUpdate()onHideonHidedeactivatedrender()activatedgetSnapshotBeforeUpdate()componentDidUpdate()销毁beforeDestroycomponentWillUnmount()onUnloaddestroyed捕获错误errorCapturedstatic getDerivedStateFromError()onErrorcomponentDidCatch()
