javascript - 更新 React 状态数组中的 bool 值

Question

目标:

在 React 应用程序中，了解如何正确更新存储在状态数组中的 bool 值。

问题:

我不确定我的代码是否正确，以避免异步错误(在这种情况下它是否有效，我不感兴趣，因为我的目标是了解如何在所有情况下避免这些错误)。为了正确创建新状态是否缺少一些语法？

上下文:

1. 在 React 中创建待办事项列表。
2. 我的状态由一个标记为 itemsArr 的数组组成，每个数组元素都是一个对象
3. 对象使用以下格式初始化:
   • { Complete : false, item : "用户输入的字符串", id : uuid(), }
4. 点击某个行项目后，我将调用一个函数 handleComplete，以便通过切换 complete : false/true 来删除该行的文本
5. 该函数正在通过以下方式更新状态:

    handleComplete(id){
      this.setState(state => 
        state.itemsArr.map(obj => obj.id === id ? obj.complete = !obj.complete : '')
      )
    }

其他详细信息:

我的尝试之一(不起作用):

    handleComplete(id){
      const newItemsArr = this.state.itemsArr.map(obj => 
         obj.id === id ? obj.complete = !obj.complete : obj);
      this.setState({ itemsArr : newItemsArr })
    }

Answer 1

在这两个代码段中，您都没有从 .map 回调中正确返回新对象:

 handleComplete(id){
  const newItemsArr = this.state.itemsArr.map(obj => 
     obj.id === id ? { id: obj.id, complete: !obj.complete } : obj);
  this.setState({ itemsArr : newItemsArr });
}