- Life cycle (Life Cycle) Refers to a component from establish => function => The destruction The whole stage of ; The emphasis is on a time period .
- Life cycle function : By Vue Built in functions provided by the framework , Will accompany the life cycle of this component Execute dynamically in order
- Be careful : Life cycle It's about time periods , Life cycle function strong Point in time .
Life cycle diagram

Create a stage
- beforeCreate ( Component's props|data|methods Not yet created , Are unavailable
- created ( Component's props| data | methods | Has created , All in You can use state , But the components Template structure has not been generated => send out Ajax The earliest time , Request data
- beforeMount Will be compiled in memory HTML structure Render to Browser . In the browser Not yet Of the current component DOM structure
- mounted The component is rendered into the browser for the first time | operation DOM The earliest time ( At this point, the memory has been HTML The structure is successfully rendered to the browser )
Operation phase
- beforeUpdate ( Will be changed according to , The latest data , Re render the template structure of the component )
- updated We have the latest data , It's done Components DOM Structural To render => Be able to operate to the latest DOM Elements
Destruction phase
- beforeDestroy About to be destroyed This component , here Not destroyed , The component is still in Normal work The state of
- destroyed The component has been destroyed , This component corresponds to... In the browser DOM structure Has been Remove... Completely !
copyright notice
author[HZM_ Endless],Please bring the original link to reprint, thank you.
https://en.qdmana.com/2021/08/20210823235655380w.html