current position:Home>Solve the problem that vuex data is reset during page refresh
Solve the problem that vuex data is reset during page refresh
2022-04-29 18:12:43【inticaler】
vuex Data is stored in memory , Every refresh of the page will result in vuex Data in reset , The current scheme is to save the data to before page refresh localStorage
stay App.vue Internal operation :
export default {
name: 'App',
data() {
return {
}
},
created() {
// solve vuex The problem of data being reset during page refresh
// Read... When the page is loaded sessionStorage Status information in
if (sessionStorage.getItem("store")) {
this.$store.replaceState(Object.assign({}, this.$store.state, JSON.parse(sessionStorage.getItem("store"))))
}
// When the page is refreshed, it will vuex Keep the information in sessionStorage in
window.addEventListener("beforeunload", () => {
sessionStorage.setItem("store", JSON.stringify(this.$store.state))
})
},
methods: {
}
}
copyright notice
author[inticaler],Please bring the original link to reprint, thank you.
https://en.qdmana.com/2022/119/202204291637245380.html
The sidebar is recommended
- About node JS server related concepts
- Access control module (2)
- About virtual lists
- Developing figma plug-in using Vue 3 + vite
- Learn more about the garbage collection engine of chrome V8 JavaScript engine
- Vue3 uses vite instead of webpack
- How to upload applet code through node? Just take a look
- Using H5 video tag in Vue to play local video in pop-up window
- What is the difference between classes in Es5 and ES6?
- [Vue] play with the slot
guess what you like
[Part 4 of front-end deployment] using docker to build cache and multi-stage construction to optimize single page applications
Vue2 simple use of vant (based on Vue CLI)
node. JS server
React uses concurrent mode. When the rendering phase exceeds the time slice, high priority tasks jump the queue. How will the lanes on the fiber of the previous task be solved
Vuecli2 multi page, how to remove HTML suffix
Vue router dynamically modifies routing parameters
How to use webpack or configure quasar after context isolation is turned on by electron?
Vue3 how do parent components call child component methods
Es learning notes (I): http request
【Java WEB】AJAX
Random recommended
- Java project: nursing home management system (java + springboot + thymeleaf + HTML + JS + MySQL)
- Java project: drug management system (java + springboot + HTML + layui + bootstrap + seals + MySQL)
- Java project: agricultural material management system (java + springboot + easyUI + HTML + Maven + MySQL)
- How do Vue, native JS and jQuery feel about development
- The Ajax backend accepts post data and writes it directly to the database
- Java project: agricultural material management system (java + springboot + easyUI + HTML + Maven + MySQL)
- Brother Lao Yu takes you to play with esp32:14 and personally make a two-way wireless remote control (I)
- How to create JavaScript custom events
- A king's time, I learned nginx
- Vue quick start (with actual small items: Notepad, weather forecast, music player)
- Vue: convert user input to numeric type
- - Status code: 404 for http://mirrors.cloud.aliyuncs.com/centos/8/AppStream/x86_64/os/repodata/repom
- vue. config. Understanding of agent in JS
- After the node is successfully installed, CMD can be executed, but the compiler webstorm runs NPM install and prompts that there is no solution to this command
- How to develop and deploy front-end code in large companies
- Vue assigns permissions to buttons through instructions
- [development diary from 22 years to April] Vue problems encountered in actual projects and their solutions
- [methodology 1] CSS development skills - global style setting and local style
- vue3. 0 dynamically bind and obtain DOM through ref;
- How to use HTML to display segmentation
- How to use HTML for touch event in mobile terminal
- How to define and use HTML box model
- How to use the box pack attribute and box align attribute inside the box in HTML
- What are the differences and relationships among HTML, CSS and JS
- How to save home page as HTML
- How to solve the post request return 405 of nginx reverse proxy to HTML page
- How to upload pictures without refresh with HTML5 + PHP
- How to define HTML text tags, pictures, paths, hyperlinks and anchors
- How to upload static HTML files to the host or server
- How to use calculated and watch in Vue
- How does Vue Preview PDF, word, xls, PPT and txt files
- Can jQuery listen for events
- Luxury cars "senseless price increase", the configuration of the new Porsche Macan remains unchanged, with a maximum increase of 19000 yuan
- 1-ch579m program upgrade OTA (self built Internet of things platform) - ch579m uses its own Ethernet to remotely download and upgrade MCU program through HTTP (MCU program rotation check and update)
- The front-end downloads files, and the back-end sends gzip files. Is there a way to get the file size?
- Why does Vue route jump refresh the page?
- The conversion code of Babel in the project needs to include node_ Modules
- [nginx] prefix removal in nginx proxy pass configuration
- Vue packaging error module build failed: typeerror: this getOptions is not a function
- Use of I18N in Vue