Reactjs 切换处于状态的对象数组中对象内部的布尔属性

我有一个状态为的对象数组，如下所示：

this.state = {
  week: [
    {
      en: 'Mon',
      morn: false,
      night: false,
    },
//... the rest of the days...

我可以成功切换早晚布尔值，如下所示：

this.setState(prevState => {
      prevState.week.map(day => {
        if (target.includes(day.en)) {
          if (target.includes('morn')) {
            day.morn = !day.morn;
          //^ right here
          }
          if (target.includes('night')) {
            day.night = !day.night;
          //^ and here
          }
        }
        return day;
      });
    });

---

eslint抱怨：函数参数“day”的属性赋值。

您之所以得到此结果，是因为您的linter启用了以下规则：

对声明为函数参数的变量的赋值可能会产生误导，并导致混淆行为，因为修改函数参数也会改变对象的参数。通常，对函数参数的赋值是非故意的，并且表示错误或程序员错误

此规则也可以配置为在修改功能参数时失败。对参数的副作用会导致违反直觉的执行流程，并使错误难以追踪

若要解决此问题，可以创建day对象的副本，您可以修改并返回该副本：

this.setState(prevState => {
  prevState.week.map(day => {
    const tempDay = {...day};
    if (target.includes(day.en)) {
      if (target.includes('morn')) {
        tempDay.morn = !day.morn;
      }
      if (target.includes('night')) {
        tempDay.night = !day.night;
      }
    }
    return tempDay;
  });
});

---

你的eslint不喜欢你改变了day的论点，他说得有道理。你应该归还新的物品。差不多了，谢谢！那只是一天。太好了@很高兴这对我有帮助。尽管您应该执行const tempDay={…day}，因为这会创建一个副本，而const tempDay=day只会创建对同一对象的新引用。此外，如果这有帮助，请考虑将这个答案标记为接受的和/或上投票。幸运的是，最终的解决方案实际上是通过谷歌搜索所有的eslint错误。我制作了state对象的副本，对其进行操作，然后用新对象替换原始对象，从而使代码更好、可读性更好。