Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/vue.js/6.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/5/date/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Vue.js Vuejs-vuex延迟加载_Vue.js_Vuejs2_Vue Router_Vuex - Fatal编程技术网

Vue.js Vuejs-vuex延迟加载

Vue.js Vuejs-vuex延迟加载,vue.js,vuejs2,vue-router,vuex,Vue.js,Vuejs2,Vue Router,Vuex,我有一个相当大的VueJS SPA,我只想使用延迟加载在某些路由上加载vuex模块 我跟随这篇文章来复制这个- 但是,这在vuex中给了我一个错误 文件夹结构 root |- store | |- modules | | |- auth.js | | |- module2.js | |- store.js |- app.js auth.js const state = { var1: {}, var2: false } const mutations

我有一个相当大的VueJS SPA,我只想使用延迟加载在某些路由上加载vuex模块

我跟随这篇文章来复制这个-

但是,这在vuex中给了我一个错误

文件夹结构

root
  |- store
  | |- modules
  | | |- auth.js
  | | |- module2.js
  | |- store.js
  |- app.js
auth.js

const state = {
    var1: {},
    var2: false
}

const mutations = {
    'MUTATION_1'(state, obj) {
        // logic
    }
}

const actions = {
    action1({commit}) {
       // logic
    }
}

const getters = {
    var1: state => state.var1,
    var2: state => state.var2
}

export default {
    state,
    mutations,
    actions,
    getters
}
store.js-

import Vue from 'vue';
import Vuex from 'vuex';

Vue.use(Vuex);
const store = new Vuex.Store();

import('./modules/auth.js').then(auth => {
    store.registerModule('/login', auth);
});

export default store;
app.js-

import Vue from 'vue';
import store from './store/store';
import VueRouter from 'vue-router';
import { routes } from './routes/routes';

// vue-router config
Vue.use(VueRouter);

const router = new VueRouter({
    mode: 'history',
    routes
});

const app = new Vue({
    el: '#app',
    store,
    router
});
错误-

[vuex] unknown getter: var1
有什么建议吗

store.registerModule('/login', auth);

上面的代码将
auth
模块注册为
login
名称空间,因此为了从存储访问其状态、getter、translation和action,您必须在所有这些模块前面加上路径
login/
。出现错误是因为您可能尝试了
store.getters.var1
,而您本应调用
store.getters['login/var1']
,在加载登录模块之前调用了Getter。之所以会出现这种情况,是因为
import()
是异步函数,并且模块是在创建computed watcher后的某个时间注册的。
return store.state.login&&store.getters['login/var1']
incident computed getter将首先将您的组件订阅到
store.state
更改,然后,在登录模块加载并注册后,
存储。状态
将更改并触发组件计算getter,并自动订阅任何
状态。登录
更改

谢谢,就这样了:P