Javascript 使用模块和Vuex persistedstate持久化Vuex状态

因此，我正在vue中实现auth，目前我正在刷新时丢失状态，而刷新会清除我的jwt令牌。我在上遇到了

vuex persistedstate

，在将其与模块一起使用时，我似乎无法正确使用语法。如何将我的

令牌

和

状态

保存在我的

auth.js

模块中

如果我转到本地存储，它似乎在添加状态，但当我刷新页面时，它不会持久存在

index.js

从“Vue”导入Vue；
从“Vuex”导入Vuex；
从“@/store/modules/auth”以身份导入*
从“vuex persistedstate”导入createPersistedState
Vue.use（Vuex）；
const authState=createPersistedState({
路径：['auth']
})
导出默认的新Vuex.Store({
模块：{
认证
},
插件：[authState]，
});

auth.js

从“Vue”导入Vue；
从“Vuex”导入Vuex；
从“axios”导入axios；
Vue.use（Vuex）；
// https://scotch.io/tutorials/handling-authentication-in-vue-using-vuex
导出常量状态={
状态：“”，
token:localStorage.getItem（'token'）| |“”，
用户：{}
}
//同步更新状态
//**突变应该总是被抽象出来并付诸行动**
导出常量突变={
授权请求（状态）{
state.status='正在加载'
},
验证成功令牌（状态，令牌）{
state.token=token
},
验证成功用户（状态，用户）{
state.user=用户
},
身份验证成功状态（状态，状态）{
state.status=状态
},
验证错误（状态）{
state.status='error'
},
注销（状态）{
state.status=“”
state.token=“”
},
}
//行为类似于全局计算方法
导出常量getter={
isLoggedIn:state=>！！state.token，
authStatus:state=>state.status，
}
//围绕突变异步包装业务逻辑。
导出常量操作={
登录（{commit，dispatch}，user）{
返回新承诺（（解决、拒绝）=>{
提交（“授权请求”）；
axios（{url:'http://localhost:5000/api/auth/authenticate，数据：用户，方法：'POST'}）
。然后（resp=>{
const token=resp.data.token；
const user=resp.data.user；
setItem（'token'，token）；
axios.defaults.headers.common['Authorization']='Bearer${token}`；
分派（“authSuccess”，{token，user}）；
解决（resp）；
})
.catch（错误=>{
提交（'AUTH_ERROR'）；
localStorage.removietem（'token'）；
拒绝（错误）；
})
})
},
authSuccess（{commit}，{token，user}）{
提交（'AUTH_SUCCESS_STATUS'，'SUCCESS'）；
提交（'AUTH_SUCCESS_TOKEN'，TOKEN）；
提交（'AUTH\u SUCCESS\u USER'，USER）；
},
寄存器（{commit，dispatch}，user）{
返回新承诺（（解决、拒绝）=>{
提交（“授权请求”）；
axios（{url:'http://localhost:5000/register，数据：用户，方法：'POST'}）
。然后（resp=>{
const token=resp.data.token；
const user=resp.data.user；
setItem（'token'，token）；
axios.defaults.headers.common['Authorization']=token；
分派（“authSuccess”，{token，user}）；
解决（resp）；
})
.catch（错误=>{
提交（'AUTH_ERROR'，err）
localStorage.removietem（'token'）
拒绝（错误）
})
})
},
注销（{commit}）{
返回新承诺（（解决、拒绝）=>{
提交（'注销'）
localStorage.removietem（'token'）
删除axios.defaults.headers.common['Authorization']
解决（）
window.sessionStorage.clear（）；
})
}
}
导出常量模块={
}