The Vue single-page application ensures that the F5 strong brush does not clear the data solution, vuef5

The Vue single-page application ensures that the F5 strong brush does not clear the data solution, vuef5

Problem description:

When you press F5 to perform a single Vue page, the data will be restored to the initial state. How can this problem be solved?

Solution:

Store. subscribe (mutation, state) => {sessionStorage. setItem ('lelestate', JSON. stringify (state);}) if (sessionStorage. getItem ('lelestate') {state = JSON. parse (sessionStorage. getItem ('lelestate');} else {state = stateOrg ;}

Ps: The following figure shows the reason why the Vue parent component cannot receive the child component $ emit event.

There are two common cases:

1. All event names are in lower case. The event name must be in lowercase.

2. It is not a parent-child relationship. The parent-child relationship here is a strict parent-child relationship. It can only be triggered at one layer, which is easy to fall into the trap when writing tree components.