使用vuejs新的vuex存储获取意外的配置错误

时间:2016-03-05 09:47:57

标签: javascript node.js vue.js

在使用browserify安装新的npm和vuex之后,创建新的Vue.store会不断抛出calendar_component.js:10205Uncaught TypeError: Cannot read property 'config' of undefined.

打开错误会显示以下代码:

function Store() {
      var _this = this;

      var _ref = arguments.length <= 0 || arguments[0] === undefined ? {} : arguments[0];

      var _ref$state = _ref.state;
      var state = _ref$state === undefined ? {} : _ref$state;
      var _ref$mutations = _ref.mutations;
      var mutations = _ref$mutations === undefined ? {} : _ref$mutations;
      var _ref$modules = _ref.modules;
      var modules = _ref$modules === undefined ? {} : _ref$modules;
      var _ref$middlewares = _ref.middlewares;
      var middlewares = _ref$middlewares === undefined ? [] : _ref$middlewares;
      var _ref$strict = _ref.strict;
      var strict = _ref$strict === undefined ? false : _ref$strict;
      babelHelpers.classCallCheck(this, Store);

      this._dispatching = false;
      this._rootMutations = this._mutations = mutations;
      this._modules = modules;
      // bind dispatch to self
      var dispatch = this.dispatch;
      this.dispatch = function () {
        for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
          args[_key] = arguments[_key];
        }

        dispatch.apply(_this, args);
      };
      // use a Vue instance to store the state tree
      // suppress warnings just in case the user has added
      // some funky global mixins
      var silent = Vue.config.silent;
      Vue.config.silent = true;
      this._vm = new Vue({
        data: state
      });
      Vue.config.silent = silent;   \\---------------> this is the line of the error here\\
      this._setupModuleState(state, modules);
      this._setupModuleMutations(modules);
      this._setupMiddlewares(middlewares, state);
      // add extra warnings in strict mode
      if (strict) {
        this._setupMutationCheck();
      }
    }

我不知道为什么会发生这种情况,我试图重新安装两者,但继续这个错误。这是我的root vue实例,我试图启动vuex商店。

// browserify entrypoint

var Vue = require('vue');
import Vuex from 'vuex';

import calendarHeader from './components/Header.vue';
import calendarSettings from './components/Settings.vue';
import calendarContent from './components/Contents.vue';

const state = {
    count: 0
}

const mutations = {
    INCREMENT (state) {
        state.count++
    }
}

const store = new Vuex.Store({
    state,
    mutations
});

new Vue({

    store,

    el: '#calendar',

    components: { calendarHeader, calendarSettings, calendarContent},

    ready: function() {

        console.log('Ready too go!');
        console.log(store.state.count) // -> 1
    },

    methods: {

        parallax: function() {

            var velocity = 0.4;
            var pos = $('#calendar').scrollTop();
            var scr = Math.round((0 - pos) * velocity);

            $('.current_day_header .header_window').css('backgroundPosition', '0 ' + scr +  'px');

                if(scr < -200){
                    scr = -200;
                }
        }

    }
});

如何解决此错误?所以我删除了所有内容并将其缩小到这一行

const store = new Vuex.Store({

有人可以帮助我吗?

2 个答案:

答案 0 :(得分:0)

答案隐藏在教程中。我正在使用示例部分来重新创建商店,但它已经错过了Vue.use(Vuex),直到很久以后他们才提到这些信息。

答案 1 :(得分:0)

import Vue  from 'vue'
import Vuex from 'vuex'
import calendarHeader   from './components/Header.vue'
import calendarSettings from './components/Settings.vue'
import calendarContent  from './components/Contents.vue'

// You have to "install" Vuex
// http://vuejs.org/api/#Vue-use
Vue.use(Vuex)

const state = {
    count: 0
}

const mutations = {
    INCREMENT(state) {
        state.count++
    }
}

const store = new Vuex.Store({
    state,
    mutations
});