Vuex Mutations和Airbnb eslint

Duy*_*Anh 6 vue.js vuex

我在我的Vuejs项目中使用Airbnb Eslint(使用Vue-cli).其中一条规则是无参数重新分配.为了控制状态(使用Vuex),必须使用突变/动作:

规则冲突

mutations: {
    increase: (state) => {
        state.counter++;
    }
}
Run Code Online (Sandbox Code Playgroud)

根据规则变更后

mutations: {
    increase: (state) => {
        const thisState = state;
        thisState.coutner++;
    }
}
Run Code Online (Sandbox Code Playgroud)

是否有更好的方法来编写上述声明而不是破坏eslint规则?

解决方案 (感谢Cobaltway回答)

添加'state'ignorePropertyModificationsFor规则.

Cob*_*way 23

不,对不起

由于Vuex存储的状态由Vue激活,当我们改变状态时,观察状态的Vue组件将自动更新.这也意味着当使用普通Vue时,Vuex突变会受到相同的反应性警告[...]

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

它确实意味着您必须改变参数以获得对实际状态的任何更改.唯一的解决方案是关闭该规则.

附录:

我可能有更好的解决方案.请注意,这是由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
  ]
}],
Run Code Online (Sandbox Code Playgroud)

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