The vue project keepAlive keeps the page state (the details page returns to the list page without refreshing)
In the vue project, when there is an operation to jump from the list page to the details page, and then return to the list page, if the list is too long, we often hope that when returning to the list page from the details page, the list page can stay in the position we swipe , that is, to preserve the page state, which can be achieved by setting the keepAlive property of the vue route.
The routing jumps in vue are refreshed by default. By default, the list page is returned from the details page, and the list page is reinitialized.
Set the route of the list page to '/list', and set the keepAlive property to true in the meta.
keep-alive is an abstract component in vue. The routes or components included by keep-alive will not be mounted, only when entering for the first time It will be initialized when it is entered, and it needs to be manually refreshed after entering.
The state cache is only for the list page, and the routing is distinguished. When the keepAlive property is true, it is included with the keep-alive component.
In this way, the state cache of the list page can be realized.
The components contained in the keep-alive component can also be used for state caching, and the components that need to save the state in the page can be included with the keep-alive component.
<keep-alive>
需要保存状态的组件...
</keep-alive>
END
If it is helpful to you, remember to like it (~~)