vue.js - Vuex Mutations 和 Airbnb eslint

Question

我不唱歌Airbnb Eslint在我的 Vuejs 项目上(使用 Vue-cli)。其中一条规则是 no-param-reassign .为了控制状态(使用 Vuex)，必须使用突变/ Action :

规则冲突

mutations: {
    increase: (state) => {
        state.counter++;
    }
}

按规则修改后

mutations: {
    increase: (state) => {
        const thisState = state;
        thisState.coutner++;
    }
}

有没有更好的方法来编写上面的语句并且不违反 eslint 规则？

解决方案 (感谢 Cobaltway 的 answer )

将 'state' 添加到规则的 ignorePropertyModificationsFor 中。

Answer 1

不，对不起。

Since a Vuex store's state is made reactive by Vue, when we mutate the state, Vue components observing the state will update automatically. This also means Vuex mutations are subject to the same reactivity caveats when working with plain Vue [...]

来源:https://vuex.vuejs.org/en/mutations.html

这确实意味着您必须改变参数以使任何更改进入您的实际状态。唯一的解决办法是关闭该规则。

附录:

我可能有更好的解决方案。请注意，这是由 their ESLint 强制执行的实际规则。 :

'no-param-reassign': ['error', {
  props: true,
  ignorePropertyModificationsFor: [
    'acc', // for reduce accumulators
    'e', // for e.returnvalue
    'ctx', // for Koa routing
    'req', // for Express requests
    'request', // for Express requests
    'res', // for Express responses
    'response', // for Express responses
    '$scope', // for Angular 1 scopes
  ]
}],

您可以将 'state' 添加到 ignorePropertyModificationsFor 数组，这样您在修改状态属性时就不会遇到错误。