Vuex动态模块未命名空间

时间:2018-07-24 05:34:17

标签: javascript vue.js vuex

我正在使用一个模块化vue应用程序,该应用程序在编译时注册模块。请查看下面的代码-

app.js

import store from './vue-components/store';

var components = {
    erp_inventory: true,
    erp_purchase: true,
};

// Inventory Module Components
if (components.erp_inventory) {
    // erp_inventory.
    store.registerModule('erp_inventory', require('./erp-inventory/vue-components/store'));
    // erp_inventory/product_search_bar
    store.registerModule([ 'erp_inventory', 'product_search_bar' ], require('./erp-inventory/vue-components/store/products/search-bar'));
}

./ erp-inventory / vue-components / store / index.js

export default {
    namespaced: true,
    state() {
        return {};
    },
    getters: {},
    actions: {}
}

./ erp-inventory / vue-components / store / products / search-bar / index.js

export default {
    namespaced: true,
    state() {
        return {
            supplier_id
        };
    },
    getters: {
        supplier_id: (state) => {
            return state.supplier_id;
        }
    },
    actions: {
        set_supplier_id({ commit }, supplier_id) {
            commit('set_supplier_id', supplier_id);
        }
    },
    mutations: {
        set_supplier_id(state, supplier_id) {
            state.supplier_id = supplier_id;
        }
    }
}

当我使用context.$store.dispatch('erp_inventory/product_search_bar/set_supplier_id', e.target.value, {root:true});在search-bar / index.js中分派操作时,vue无法找到说明[vuex] unknown action type: erp_inventory/product_search_bar/set_supplier_id的命名空间

我已经阅读了vuex和动态模块的文档,即使我在每个商店中都设置了namespaced: true,,该问题仍然存在。转储我的应用程序商店后,我发现从未为注册的模块设置namespaced(请参见下图)。

Namespaced is false

除非我做错了,否则可能是错误吗?

1 个答案:

答案 0 :(得分:1)

您必须使用require(....)。default,否则您将无法从ES6模块文件获得默认的导出PC,而是通过包装它的webpack来获取对象。