Problems with vue+vue-router+vuex+vue-resource project refresh page

recently learned vue, and wrote a test project with vue, managed the status using vuex, updated the data after the background request was successful using vue-resource, and then jumped to the page using vue-router. There is no problem in the normal process. The rendering of the page data is successful, but once the page data is refreshed, it is all gone

.
Mar.17,2021

you can store the data locally localStorage ah. Otherwise, there will definitely be no refresh


the subject can refer to my example todolist


retrieve the data in the ready method of component


store the data in vuex every time you take the data from the inside and modify it


because you haven't stored it. Try


with localStorage. I also encountered this problem in angular. I saved public data through a service, and then which page was used to inject the service, but as soon as the data was refreshed, it was gone. The solution to this problem is not to use localstorage, but to solve it through object assignment. First, declare an object to save ajax data, and then take the object as the value of the property returned by the service.


router has a built-in api specific floor owner to see that the document is written on router-view


page refresh of course the data is gone. If you jump routing, the contents of the vuex will not be emptied. You can save the local stand-alone project made by yourself to localstorage


you need to take a look at the vue-router documentation. This problem is mentioned in the chapter HTML5 History mode. You need to configure the mode:history, backend when you use the mode:history, backend for routing. If you are using express, you need to use connect-history-api-fallback middleware. For more information on how to use
, please see if anything else is not clear. It is very clear.


the data of vuex is stored in memory, so refresh is gone. Unlike sessionStorage, for data persistence, it is recommended that sessionStorage exist locally

Menu