your business scenario has nothing to do with vuex, is it?

vuex is a tool for promoting variables, which stores state as global variables. After F5 refreshes the page, state is naturally reinitialized with the refresh of the page.

at present, if you want browsers to remember data, they usually use methods such as cookie or localStorage. If there are any other methods, you are welcome to share them.

window.localstorage
just save it

here is a library that saves the state of vuex in localstorage vuex-persistedstate , so there is no need to directly operate localstorage, according to vuex way, according to personal preference, it is not bad to use! By default, all state is saved in a string with key as vuex.

I am listening on it in router.js. If the value in vuex is empty, then reassign it from sessionStorage

/ / take token as an example. When the page is refreshed, the value
if (sessionStorage.getItem ("token")) {
store.commit ("set_token", sessionStorage.getItem ("token"));
}

if you use vuex, you can put the global data in vuex, or you can put the data in the root component app.vue. Get

hi, via this.$root.data. Here is the encapsulated https://www.npmjs.com/package.

write a simple plug-in by yourself
generally use enough
if you are interested, you can see

vuex-along

No.2 I don't know if you mean only session and local or all the storage methods of window (cookie or websql), if it is the former, you can use other storage methods, if it is the latter, then there is nothing you can do about it.

also encounters the same problem. A state saved after login has been set. F5 refreshes the page, and the initial value set by vuex should not be like this in theory. Otherwise, vuex is meaningless

according to what you want, at least not now, even if vuex has such a method to support it in the future, it will be realized by localStorage,sessionStorage.

I also encountered the same problem. I didn't have any problems at first. There are always bug

.
1. use local storage
2. when the page is loaded, you can write an if to determine whether the state exists. If it does not exist, re-request to record the state, is not good is to judge where this state is used.

has started to use this plug-in. Very good ~

vuex-persistedstate

vue-savedata

this plug-in is easier to configure-and supports both session and localstoreage

five methods
highly recommended history.replaceState (null, null,'? type=save')

1. history.replaceState (null, null,'? type=save') add properties to HTML5 this method changes the current route, but does not refresh, and does not add records to the browser's access history. The only disadvantage is poor compatibility [highly recommended]

this method accepts three parameters, in turn:

• state : a state object associated with the added record, mainly used for popstate events. When this event is triggered, the object passes in a callback function. That is, the browser will serialize the object locally and get it when the page is reloaded. If you don't need this object, you can fill in null here.
• title : the title of the new page. However, now all browsers ignore this parameter, so you can fill in the blank string here.
• url : the new URL must be in the same domain as the current page. The address bar of the browser will display this URL.

2. Create an identity to write hash window.location.hash = 'save' the user determines whether the hash requests the interface when refreshing the browser, but the hash change will be recorded in the browser. Each time the-sharp is changed, a record will be added to the browser's access history. Using the "back" button, it will go back to the previous position, [so this method is not recommended]

3. Write cookie and send it to the server (in the case of a small amount of data)

4. Save to localstorage (with same origin policy)

5. Store to sessionStorage (with same origin policy and data that cannot be shared between tags)