reactjs - 将对象数组发送到 React 中的组件的最佳实践？

Question

在 React 中，假设您有一个要显示列表的组件。

将列表传递给组件的哪个更符合 React/Redux 的方法？

1. 传递对象数组
2. 只传递一个键数组，加上一个映射（字典）来查找对象

例如：

<ListComponent data={objectArray} />

对比

<ListComponent keyArray={keyArray} dictionary={mapOfKeyToObject} />

请考虑性能、可重用性、公认的约定和测试。

谢谢

编辑：为了澄清，我的意思是对象的 ID 字段中的键（不是谈论 React 用于在渲染中识别的键）。

该问题与 [ https://redux.js.org/basics/reducers#note-on-relationships]有关：

在更复杂的应用程序中，您将希望不同的实体相互引用。我们建议您尽可能保持状态标准化，不要进行任何嵌套。将对象中的每个实体保存为以 ID 作为键存储，并使用 ID 从其他实体或列表中引用它。...例如，将 todosById: { id -> todo } 和 todos: 数组保留在状态中将是一个真正的应用程序中的更好主意。

那么将字典传递给组件（例如 todosById）加上第二个数组（仅显示要显示的键/ID）与具有仅是对象的子集数组是否更好？

考虑到这些对象可能会被其他组件更新。

标签： reactjsreduxreact-redux

Answer 1

第一个是放置对象数组的正确方法。您只发送一个而不是 2 个属性。