Javascript / react - .map 无法正常工作

Posted 2023-02-22

【中文标题】Javascript / react - .map 无法正常工作

【英文标题】：Javascript / react -- .map is not working properly

【发布时间】：2021-03-17 15:15:17

【问题描述】：

参加反应课程，我们正在使用 setState 制作一个简单的待办事项列表。我试图在 onChange 事件上获得布尔更改的值。我卡住了。

我有一个对象数组，

数组定义：

toDoData = [
    
        id: 1,
        task: "Do laundry",
        completed: false
    ,
    
        id: 2,
        task: "Write essay",
        completed: false
    ,
    
        id: 3,
        task: "Do Homework",
        completed: true
    

]

为了简单起见，我试图通过数组进行映射并创建一个新数组，其中完成的属性与以前相反。

 let updatedTodos = this.state.todos.map(todo => 
        todo.completed = !todo.completed
        return todo
      )
 
 console.log(updatedTodos)

当我打印到控制台时，完成的值没有改变。

【问题讨论】：

能贴出所有的组件代码吗？你的方法是正确的..

您正在更改 map() 调用中的嵌套对象。尝试.map(todo => (...todo, completed: !todo.completed));，它将创建原始对象的副本并按预期更新completed 属性。

@pilchard 成功了，谢谢

【参考方案1】：

试试：

let updatedTodos = this.state.todos.map(todo => ( ...todo, completed: !todo.completed ));
console.log(updatedTodos);