如何從javascript文件（而不是vue組件）調度動作？

Question

我有一個模塊（javascript文件）在vue上下文之外。我需要從這個JavaScript文件調度行動。可能嗎 ？如果是的話，那麼如何？

jsfile.js（JavaScript文件）

const detail = {}; 

detail.validateLocation = (location) => { 
    // need to dispatch one action from here. 
    // dispatch('SET_LOCATION', {city: 'California'}) 
    // how to dispatch action ? 
} 

export default detail; 

action.js

export default { 
    SET_LOCATION: ({ commit}, data) => { 
    commit('SET_LOCATION', data); 
    }, 
} 

store.js

import Vue from 'vue'; 
import Vuex from 'vuex'; 
import actions from './actions'; 
import mutations from './mutations'; 
import getters from './getters'; 
export function createStore() { 
    return new Vuex.Store({ 
    modules: {}, 
    state: { 
     location: null 
    }, 
    actions, 
    mutations, 
    getters, 
    }); 
} 

Answer 1

首先，在store.js創建存儲。

import Vue from 'vue'; 
import Vuex from 'vuex'; 
import actions from './actions'; 
import mutations from './mutations'; 
import getters from './getters'; 

const store = new Vuex.Store({ 
    modules: {}, 
    state: { 
     location: null 
    }, 
    actions, 
    mutations, 
    getters, 
    }); 

export default store 

然後，導入存儲到jsfile.js並使用它。

import store from "./store" 

const detail = {}; 

detail.validateLocation = (location) => { 
    // Use imported store 
    store.dispatch('SET_LOCATION', {city: 'California'}) 
} 

export default detail; 

假設你有一個創建您的Vue實例的主要或索引文件，你現在有可能需要進口，從進口的創造功能簡單地導入存儲更改。