Vuex 解决了多视图之间的数据共享问题。但是运用过程中又带来了一个新的问题是,Vuex 的状态存储并不能持久化。也就是说当你存储在 Vuex 中的 store 里的数据,只要一刷新页面,数据就丢失了。
原来是这个插件报错,后来再次寻找Vue持久化存储插件找到了 vuex-persistedstate 这个插件,就抱着试一试的心态看看是否有用,后来发现IE浏览器能够打开,页面刷新数据也不会丢失
使用方法
安装
npm install vuex-persistedstate --save
引入及配置
在store下的index.js中
import persistedState from 'vuex-persistedstate'
const store = new Vuex.Store({
// ...
plugins: [persistedState()]
})
默认存储到localStorage
想要存储到sessionStorage,配置如下
import persistedState from "vuex-persistedstate"
const store = new Vuex.Store({
// ...
plugins: [persistedState ({
storage: window.sessionStorage
})]
})
网友评论