Question

在构建Todo应用程序时，我想使用remove函数从数组中过滤出一个对象。到目前为止，我明白了。

deleteTask(task) {

    let taskList = this.state.tasks;

    var newTask = taskList.filter(function(_task) { return _task != task})

    this.setState({ 
        tasks: newTask
    });

}

唯一的问题是，该函数在使用该函数时会返回整个数组。因此，应该仅从我的数组中返回一个对象的Task参数将返回整个数组，而不是在newTask变量中。

如何绑定或使此功能起作用？

我要从中删除对象的数组不在同一Component中，不知道这是否重要。但有关其他信息。

Answer 1

首先，让我们看看为什么_task != task不能按需工作。试试这个：

const a = { x: 10, y: 'hello' };
const b = { x: 10, y: 'hello' };
console.log(
  a==b,
  a===b,
  Object.is(a,b)
);

令人惊讶，是吗？阅读this了解更多详情。

无论如何，您应该重构代码以在任务中包含id属性，以便可以将两个任务及其ID进行比较-无需担心JavaScript中对象比较的怪异实现！

这应该可以工作：

deleteTask(taskId) {
  this.setState(prevState => ({
    tasks: prevState.tasks.filter(task => task.id !== taskId)
  }));
}

Answer 2

javascript中的

Equality运算符比较对象的引用。因此，即使两个对象都具有相同的值，因为它们指向不同的实例，所以==始终将返回false。因此，我看到您有两个选择：

重构您的代码以包含id部分，并比较其中的两个任务。
使用lodash或下划线之类的库进行深度比较

使用.filter在React中删除函数

2 个答案: