如何在store.js文件中動態路由

Question

我有一個store.js（vuex）函數，它檢查一些條件，如果滿足， 它應該發起路由到另一個組件。

this.$router.push()在store.js中無法正常工作。

vm.$router.push()都沒有工作，這裏是vm = new Vue()。

Answer 1

TL; DR您不需要使用vue實例引用路由器，只需導入路由器，然後使用它的方法。

假設你的router.js看起來像這樣。

import Vue from 'vue'; 
import Router from 'vue-router'; 

Vue.use(Router); 

export default new Router({ 
    routes: [ 
    /* ... */ 
    ], 
}); 

那麼您可以在您的store.js

import router from './router'; 

導入，這樣你可以在你store.js像這樣使用它。

import Vue from 'vue'; 
import Vuex from 'vuex'; 
import router from './router'; 

Vue.use(Vuex); 

const store = new Vuex.Store({ 
    state: { 
     username: '', 
    }, 
    mutations: { 
     updateUsername(state, payload) { 
      state.username = payload; 
     } 
    }, 
    actions: { 
     updateUsername({ commit }, payload) { 
      commit('updateUsername', payload); 
      router.push('/'); // <--- router 
     }, 
    }, 
});