1. The life cycle in Vue3
1. setup(): Before starting to create the component, it is executed before beforeCreate and created, and the data and method are created
2. onBeforeMount() : the function executed before the component is mounted on the node;
3. onMounted() : the function executed after the component is mounted;
4. onBeforeUpdate(): the function executed before the component is updated;
5. onUpdated(): The function executed after the component is updated;
6. onBeforeUnmount(): the function executed before the component is unmounted;
7. onUnmounted(): The function executed after the component is unmounted;
8. onActivated(): The component contained in <keep-alive> will have two more lifecycle hook functions, which will be executed when activated;
9. onDeactivated(): For example, switch from A component to B component, and execute when A component disappears;
10. onErrorCaptured(): The hook function is activated when an exception from a descendant component is caught.
2. Comparison between Vue2.X and Vue3.X
vue2 -------> vue3
beforeCreate --------> setup(()=>{})
created --------> setup(()=>{})
beforeMount --------> onBeforeMount(()=>{})
mounted --------> onMounted(()=>{})
beforeUpdate --------> onBeforeUpdate(()=>{})
updated --------> onUpdated(()=>{})
beforeDestroy --------> onBeforeUnmount(()=>{})
destroyed --------> onUnmounted(()=>{})
activated --------> onActivated(()=>{})
deactivated --------> onDeactivated(()=>{})
errorCaptured --------> onErrorCaptured(()=>{})
The picture is as follows:
————————————————
Copyright statement: This article is an original article by CSDN blogger "Xiaobai Chong", following the CC 4.0 BY-SA copyright agreement, please attach the original source link and this statement for reprinting.
Original link: https://blog.csdn.net/m0_57341617/article/details/126426931