Introduction to Vue life cycle
The meaning of the lifecycle: There are always various events between Vue instance creation, running, and destruction, which are collectively referred to as the lifecycle
Life cycle hooks == life cycle functions == life cycle events
Second, the creation stage
-
BeforeCreate: The instance is created in memory, but data and methods are not initialized
-
Created: The instance is created in memory and data and methods are initialized
-
BeforeMount: The template is compiled at this point, but not yet rendered into the interface
-
Mounted: The template has been rendered in the browser, and is ready to run.
3. Operation stage
-
BeforeUpadte: Data on the interface is old, but data is updated. The page does not synchronize with data
-
Updated: The page is rerendered and the data in the page is consistent with data
3. Destruction stage
-
BeforeDestroy: When this method is executed, the Vue life cycle has already entered the destruction phase, but various data and methods on the instance are still available
-
Destroyed: Components are destroyed, Vue instance is destroyed, and any data in Vue is not available
4. Life cycle analysis diagram
This is a more detailed explanation of the image on the official website, which I downloaded from other curmudgeons and can save on my phone. The VUE lifecycle is important, and knowing what is being done at each stage can help you develop your project better.Copy the code