老师能讲解一下vuex-persistedstate怎么使用吗?
来源:2-12 Vuex高级用例(2)

菜鸟x
2019-06-30
我去查了下vuex,vuex在刷新页面或者去到其它页面的时候会清空掉状态。所以要使用vuex-persistedstate来存储到localstorage里面,刷新页面或者去其它页面也不会清空。看了几个博客的解释,但我看不太懂。
最好能写个小例子。在某一个页面通vue-resource或者vue-axios从后端取到的数据存到vuex的state里面,这个app里面所有页面都能用state里数据。
import Vue from 'vue'
import Vuex from 'vuex'
import persistedState from 'vuex-persistedstate'
Vue.use(Vuex)
export default new Vuex.Store({
state: {
userName: '您还未登录',
backName: '返回登录界面'
},
mutations: {
setName (state, name) {
state.userName = userName // 登录后从后端取到的用户昵称(登录成功的时候调用this.$store.dispatch('getName', res.data.userName))
state.backName = '安全退出' // 登录成功后退出按钮名字改成这个
}
},
actions: {
getName ({ commit }, obj) {
commit('setName', obj)
}
},
plugins: [persistedState({
storage: window.localStorage
})]
})
就大概这种功能,但我写的这个好像不行。
我在就业班里面问了,里面的老师说只讲一下vuex的基础用法,再深入的就不讲,叫我来买有讲vuex的老师的课程来问。所以现在来问老师您了。麻烦老师回答一下,谢谢了。
写回答
1回答
-
快乐动起来呀
2019-07-02
是按 https://www.npmjs.com/package/vuex-persistedstate 这个来的吗,nuxt.js 的版本要求一致吗,我建议你用最新的nuxt.js起一个初始化项目,然后再配合这个插件试试,其实很简单的
00
相似问题