编辑：我意识到 Vuex 可能允许在突变中直接改变状态，而不是在 Redux 突变中将状态视为不可变的。如果是这种情况，并且我的大部分研究都表明人们认为这样做是可以的，那么我就可以避免之前使用解构赋值的要求。

问题 ：如果我在模块的突变中使用解构赋值，Vuex 似乎会在收集模块时抛出错误。

我尝试过的 ：注释掉解构赋值可以消除错误。

观察 ：突变从未被调用，或者至少放置的 console.log 消息从未被记录。

版本 ： [email protected] 、 [email protected] , node v10.17.0

removeItem (state, id) {
    const { [id]: unused, ...rest } = state.items
    state.items = rest
}

vuex.common.js:272 Uncaught TypeError: Cannot read property 'getters' of undefined
    at vuex.common.js:272
    at Array.forEach (<anonymous>)
    at assertRawModule (vuex.common.js:271)
    at ModuleCollection.register (vuex.common.js:197)
    at vuex.common.js:211
    at vuex.common.js:80
    at Array.forEach (<anonymous>)
    at forEachValue (vuex.common.js:80)
    at ModuleCollection.register (vuex.common.js:210)
    at new ModuleCollection (vuex.common.js:171)

为了隔离我认为导致问题的原因，从语法上讲，这会导致 Vuex 中出现错误：

removeItem (state, id) {
    const { [id]: unused, ...rest } = state.items
}

但是这不会：

removeItem (state, id) {
    const { [id]: unused } = state.items
}

我发现我们正在使用 browserify 进行转译，结果如下：

removeReadyHelp: function removeReadyHelp(state, name) {
    var _state$items = state.items,
        unused = _state$items[name],
        rest = _objectWithoutProperties(_state$items, [name]);
}

...

function _objectWithoutProperties(obj, keys) {
    var target = {};
    for (var i in obj) {
        if (keys.indexOf(i) >= 0) continue;
        if (!Object.prototype.hasOwnProperty.call(obj, i)) continue;
        target[i] = obj[i];
    }
    return target;
}

以下代码是整个 vuex 模块。有问题的突变是 removeAvailableHelp （ removeItem 上面的突变被编辑为通用的。）

import helpApi from '../../api/api-viewed-help.js'

/**
 * Info about available help necessary for triggering it from the help list.
 * @typedef {object} Help 
 * @property {string} Help.name Uid name of help.
 * @property {HelpTrigger} Help.trigger 
 */

/**
 * Function to call that should trigger the available help in the help list.
 * @callback HelpTrigger 
 * @returns {void}
 */

export const module = {
    namespaced: true,
    state: {
        viewedHelpNames: [],
        availableHelp: {},
        hydrated: false
    },
    actions: {
        /**
         * Hydrate vuex state from database.
         * @param {*} vuex
         * @param {string} usercode Usercode to fetch viewed help by.s
         */
        async hydrate ({ commit }, usercode) {
            const viewedHelpNames = await helpApi.getAllViewedHelpNames(usercode)
            commit('_setViewedHelpNames', viewedHelpNames)
            commit('_hydrated')
        }
    },
    mutations: {
        /**
         * Set all viewed help names to passed array.
         * @param {*} state
         * @param {string[]} viewedHelpNames
         */
        _setViewedHelpNames (state, viewedHelpNames) {
            state.viewedHelpNames = viewedHelpNames
        },
        _hydrated (state) {
            state.hydrated = true
        },
        /**
         * @param {*} state Vuex
         * @param {Help} help 
         */
        addAvailableHelp (state, help) {
            state.availableHelp[help.name] = help
        },
        removeAvailableHelp (state, name) {
            const { [name]: unused, ...res } = state.availableHelp
            state.availableHelp = res
        }
    }
}