我正在尝试在我的通用 Nuxt 应用程序中使用 vuex-persistedstate。现在,我保持的状态值在刷新后在我的组件和页面中工作正常。当我在谷歌浏览器的 vue dev 中检查我的代码并检查状态时,我可以看到值在那里。但问题是,尽管该值被保留,但在我的 vuex 操作中,该值在刷新时丢失了。如何在操作中使用持久化值?
我在 nuxt.config.js 中的代码
plugins: [{ src: '~/plugins/persistedState.js', mode: client}]
persistedState.js 中的代码
import VuexPersistence from 'vuex-persist'
export default ({ store }) => {
const persist = new VuexPersistence({
reducer: (state) => ({
myvariable: state.myvariable
}),
}).plugin(store);
};
商店的 index.js
export const state = () => ({
myvariable: '',
)}
export const mutations ={
setmyvariable(state, payload){
state.myvariable=payload
}
}
export const actions = {
//this action is dispatched on loading my app to set some state values
async sendRequestToStartSession({commit}){
commit('setmyvariable', 'This is persisted value')
}
//this action is being dispatched from other place and uses the state values
//the value works fine till I refresh the page
stateValueAction(context, payload){
.....
console.log(console.log('myvariable:', this.state.myvariable)) //returning empty on refresh
.....
}
}