从 Vuex Store 中的 action 内推送路由

Question

试图从商店内推动路线变化。我尝试导入router到商店本身，然后按照以下方式做一些事情：

LOG_OUT({commit}){
  commit('LOG_OUT__MUTATION');

  router.push({
   name: 'Login' 
  })
}

......但这没有用。

我也不想直接从组件推送路由更改，因为这意味着我需要检查身份验证并在每个组件中推送路由更改，这对我来说似乎很麻烦。

编辑：

该LOG_OUT__MUTATION清除存储在状态令牌。

Answer 1

我终于想通了这一点。

最终实施

在您的 中store，只需导入router：

import router from '@/router/index'

actions: {

  LOG_OUT({commit}){
    commit('LOG_OUT__MUTATION');

    router.push({
      name:'Login'
    })
  }

}

然后从我的应用程序的另一部分，我简单地导入store并分派了一个动作：

import Store from '@/store/store'

myFunction () {
  Store.dispatch('LOG_OUT');
}

初步实施

这是我对 Daksh Miglani 解决方案的实现（有效）。在我的 store.js 中，我有：

export const forceLogout = (commit) => {

  return new Promise((resolve, reject) => {
    commit('LOG_OUT__MUTATION');
    resolve();
  })

}

export default new Vuex.Store({
  actions,
  mutation
})

然后在应用程序的另一部分（helpers.js），我有：

import Store from '@/store/store'
import { forceLogout } from '@/store/store'
import router from '@/router/index'

forceLogout(Store.commit)
  .then(() => {
    debugger;
    router.push({
      name:'Login'
    })

  }).catch((error) => {
     console.log(error)
  })