Javascript 如何在vue应用程序中从main.js文件访问store getter更新值？

我正在尝试从

main.js

文件访问更新的vuex getter，以检查用户是否登录。基于此，我将用户带到登录页面。在main.js文件中，我只是像这样访问store getter

var router = new VueRouter({...})

router.beforeEach((to, from, next) => {
    console.log(store.getters['general/isUserLoggedIn'])
    next()
})

general是模块名

但当简单地记录

store

时，它会显示具有更新值的对象。但是当记录

store.getters['general/isUserLoggedIn']

时，它会显示初始状态值。为什么它不提供更新的价值。这是一种正确的做法，还是存在其他替代方法

更多细节

in-store.js文件

通过调用api状态检查用户是否登录 在App.vue文件中

通用模块中的actions.js

setUserLoggedIn ({ commit }, data) {
    commit(types.SET_USER_LOGGED_IN, data)
}

const mutations = {
    [types.SET_USER_LOGGED_IN](state, data) {
        state.isUserLoggedIn = data
    }
}

通用模块中的translations.js

setUserLoggedIn ({ commit }, data) {
    commit(types.SET_USER_LOGGED_IN, data)
}

const mutations = {
    [types.SET_USER_LOGGED_IN](state, data) {
        state.isUserLoggedIn = data
    }
}

---

在初始导航中，guard中的登录尚未完成，这就是为什么在控制台中看不到该值的原因。它仅在记录

store

时显示

true

，因为它是在记录后不久设置的，当您记录对象/数组并单击以查看其属性时，控制台会自动更新

修复竞争条件的一种方法是在登录完成后重定向到主页：

axios.get（'/api/profile'）。然后（（响应）=>{
如果（response.data.status==='success'）{
this.setUserLoggedIn（true）
这是。$router.push（“/”）；//登录完成后发送到主页
}
})

在此之前，如果用户未登录，请重定向至登录：

router.beforeach（（to，from，next）=>{
const isLoggedIn=store.getters['general/isUserLoggedIn']；
如果（！isLoggedIn）{
返回next（'/login'）；
}
下一个（）
})

• 在初始加载时，用户将被重定向到登录页面
• 登录完成后，它们将被发送回主页

---

如何注册和导入

store

？在main.js中，像这样导入store

import{store}from./store'

@Mr。还有

next（）

进入

else

条件正确吗？不客气。是的，你可以把它放在一个

else

语句中，或者它也可以像我展示的那样工作。如果条件为true，则函数调用

next（'login'）

，并以

return

退出，否则它将进入下一行，在该行中调用

next