您如何在 reactjs/redux 应用程序中维护列表中的选定项目？
How do you maintain selected item in list in reactjs/redux application?
我是 reactjs/redux 应用程序世界的新手。我正在创建一个页面布局的 Web 应用程序，其中左侧有一个名称列表，右侧显示所选名称的详细信息。
使用 redux，当从列表中选择一个名字时，应用程序会调度一个 ajax 调用来获取详细信息。这最终会使用选定的详细信息更新 redux 状态，并导致详细信息组件使用信息进行更新。
姓名列表是使用 ag-grid 创建的，因此它可以突出显示所选项目。但是一旦更新了 redux 状态，所有组件似乎都会重新呈现，并且列表中的所选项目不再被选中。我想一般来说，当页面加载时，名称列表的状态会回到初始状态（即，如果列表被过滤，它就不再被过滤）。
如何在选择项目之前维护所选项目（以及实际上在该列表上完成的所有其他操作）？我几乎在想我也必须在我的 redux 状态下维护网格状态……但对吗？这是我唯一的选择吗？
我的组件结构是一个容器组件 (WSContainer)，它有两个子组件，NameTable 和 NameDetails。
为什么不将所选项目的值、索引或文本保留在状态中？然后，在页面呈现时，您可以使用 componentDidMount 或 componentWillMount 方法来突出显示所选名称（或您想要执行的任何其他操作）。
我建议您分派一个将 selectedId 保存到 redux 状态的操作。我还建议将您返回的每个详细信息存储在一个对象中，以 id 作为键，将详细信息作为值
detailsById: {
id1: detail1,
id2: detail2
},
selectedId: id1
这将使您无需等待 ajax 调用 return 即可显示详细信息。那时，您只需显示与您在选择时保存的 ID 相匹配的详细数据。
查看 this 了解有关 redux 操作的更多信息。
我是 reactjs/redux 应用程序世界的新手。我正在创建一个页面布局的 Web 应用程序，其中左侧有一个名称列表，右侧显示所选名称的详细信息。
使用 redux，当从列表中选择一个名字时，应用程序会调度一个 ajax 调用来获取详细信息。这最终会使用选定的详细信息更新 redux 状态，并导致详细信息组件使用信息进行更新。
姓名列表是使用 ag-grid 创建的，因此它可以突出显示所选项目。但是一旦更新了 redux 状态，所有组件似乎都会重新呈现，并且列表中的所选项目不再被选中。我想一般来说，当页面加载时，名称列表的状态会回到初始状态（即，如果列表被过滤，它就不再被过滤）。
如何在选择项目之前维护所选项目（以及实际上在该列表上完成的所有其他操作）？我几乎在想我也必须在我的 redux 状态下维护网格状态……但对吗？这是我唯一的选择吗？
我的组件结构是一个容器组件 (WSContainer)，它有两个子组件，NameTable 和 NameDetails。
为什么不将所选项目的值、索引或文本保留在状态中？然后，在页面呈现时，您可以使用 componentDidMount 或 componentWillMount 方法来突出显示所选名称（或您想要执行的任何其他操作）。
我建议您分派一个将 selectedId 保存到 redux 状态的操作。我还建议将您返回的每个详细信息存储在一个对象中，以 id 作为键，将详细信息作为值
detailsById: {
id1: detail1,
id2: detail2
},
selectedId: id1
这将使您无需等待 ajax 调用 return 即可显示详细信息。那时，您只需显示与您在选择时保存的 ID 相匹配的详细数据。
查看 this 了解有关 redux 操作的更多信息。