vuex刷新后数据丢失的解决方法
更新时间：2020年10月18日 15:42:48 作者：git小米粥
这篇文章主要给大家介绍了关于vuex刷新后数据丢失的解决方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
导语：
我们在写vue项目的时候，经常要用到vuex作为内存来储存，但是我们存放在vuex中的数据（用户数据，当前页面的数据等等）在刷新后就会丢失，那么如何解决呢？超级简单。
1，安装vuex-persistedstate
npm install --save vuex-persistedstate
2，修改store
import createPersistedState from 'vuex-persistedstate'
const store = new Vuex.Store({
state: {
user: {}, //用户
},
mutations: {
update_user(state, newuser) {
state.user = newuser
},
},
//把所有数据缓存到本地
plugins: [createPersistedState()],
})
export default store;
保存后，再运行程序，刷新后vuex中的数据就不会丢失了。
总结
到此这篇关于vuex刷新后数据丢失解决的文章就介绍到这了,更多相关vuex刷新数据丢失的解决内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
这篇文章主要介绍了vue3如何获取绑定页面dom元素问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2023-11-11
这篇文章主要介绍了Vue 前端路由工作原理hash与history的区别，文章围绕主题展开vue-router的工作原理的简单介绍，感兴趣的朋友可以学习一下2022-07-07
下面小编就为大家分享一篇vue2.0 路由不显示router-view的解决方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-03-03
这篇文章主要介绍了vue组件传值的11种方式总结，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-01-01
这篇文章主要介绍了一篇Vue、React重点详解大全，文章内容详细，通过案例可以更好的理解其相关知识，需要的朋友可以参考下2023-01-01
Teleport是一种能够将我们的模板移动到DOM中Vue app之外的其他位置的技术,下面这篇文章主要给大家介绍了关于Vue3中内置组件Teleport的基本使用与典型案例的相关资料,需要的朋友可以参考下2023-04-04
lodop 取意自“load or print”，是一款优秀的 Web 打印控件。本文将在Vue中集成lodop插件实现打印功能，感兴趣的小伙伴可以了解一下2023-01-01
这篇文章主要介绍了Vue中的$nextTick的相关资料，帮助大家更好的理解和使用vue，感兴趣的朋友可以了解下2020-12-12
这篇文章主要介绍了vue项目实现webpack配置代理,解决跨域问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-04-04
解决vue prop传值default属性如何使用,为何不生效的问题
这篇文章主要介绍了解决vue prop传值default属性如何使用,为何不生效的问题。具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-09-09
最新评论