Question

在我的项目中，我想显示一个组列表。每个组都有不同的任务，这些任务与（或不依赖）其他任务。我从数据库中获得的列表如下所示：

{ 
    "id": 1, 
    "group": "Before breakfast", 
    "task": "scramble eggs", 
    "dependencyIds": [], 
    "completedAt": false 
}, 
{ 
    "id": 2, 
    "group": "Before breakfast", 
    "task": "Cook Eggs", 
    "dependencyIds": [ 1 ], 
    "completedAt": false 
},
{ 
    "id": 3,
    "group": "After breakfast",
    "task": "Do the dishes",
    "dependencyIds": [ 1, 2],
    "completed": false 
}

一种解决方案是将整个数据作为数组写入状态。但这意味着，每次完成任务时，我都会筛选整个数组并必须更新整个状态。因此，我想知道从数据库中获取数据后对数据进行过滤和排序是否更有效。那么状态将如下所示：

this.state = {
      "Before Breakfast": [
        {
          id: 1,
          title: "scramble eggs",
          completed: false,
          dependencies: []
        },
        {
          id: 2,
          title: "cook eggs",
          completed: false,
          dependencies: [1]
        }
      ],
      "After Breakfast": [
        {
          id: 3,
          title: "do the dishes",
          completed: false,
          dependencies: [1, 2]
        }
      ]
    };

我的想法是，现在只需要更新带有任务的组对象，而不是整个状态。

这有意义还是不必要地使代码过于复杂？

Answer 1

好吧，我看不出这对性能或性能有什么帮助，因为在将虚拟DOM与真实DOM进行比较时，React只改变（渲染）所需的内容。而且速度非常快，我认为如果仍然不需要过滤，则应该省略过滤。

在React中布置状态的正确方法

1 个答案: