优雅解决： assignment to property of function parameter ‘state‘

在airbnb的eslint规则中，有这样一条规则no-param-reassign

目的是提醒你不要直接修改函数的入参。因为假如入参是一个对象，修改入参可能会导致对象的属性被覆盖。

// 不好的做法
function f1(obj) {
  obj.key = 1; // 可能对象本身就用key的属性，这样会覆盖原有的属性。无法确定这样做是否是对的。
}

// 好的做法
function f2(obj) {
  // 若原来有这样的属性，那么直接返回这个值，否则返回需要的值
  const key = Object.prototype.hasOwnProperty.call(obj, 'key') ? obj.key : 1;
}

但有一些情况下，我们必须要这样做，比如在vuex中

const home = {
  namespace: true,
  state: {
    list: []
  },
  mutations: {
    MY_CUSTOM_MUTATION(state, payload) {
    // 这里必须要这样写，就与eslint不可避免的冲突
      state.list= payload.docList;
    }
  }
};

其实，不仅仅是vuex，再比如express的req res，前端事件处理的e.returnvalue都需要直接给入参赋值。这时候我们显然不希望直接disable掉这条规则，或者在发生冲突的代码处单独disable。

这时候可以使用ignorePropertyModificationsFor这个属性，他可以为这个规则添加一个白名单，即指定的入参名称不予限制。看代码就明白了：

{
  .eslintrc
  ...
  "rules": {
    "no-param-reassign": [
      "error",
      {
        "props": true,
        "ignorePropertyModificationsFor": [
          "e", // for e.returnvalue
          "ctx", // for Koa routing
          "req", // for Express requests
          "request", // for Express requests
          "res", // for Express responses
          "response", // for Express responses
          "state" // for vuex state
        ]
      }
    ]
  }
}

如上代码配置即可避免vuex与eslint的冲突。