如何处理 redux 存储所持有的数据中不断变化的属性

How to handle constantly changing properties in data held by redux stores?

本文关键字：数据 属性 变化 何处理 处理 存储 redux      更新时间：2023-09-26

我需要将大约 5000 个项目呈现为表格。我正在使用 redux 来保存它们，这些项目具有持续时间属性，随着时间的推移，持续时间属性应该更新。

作为第一次剪切，我每 5 秒从服务器推送一次持续时间，这没什么大问题，因为表格是分页的，所以并非所有这些项目都呈现到 DOM。我对性能没有问题，但是我正在引入更多功能，这些功能需要我停止这样做，而且这是一种浪费，因为即使核心数据没有改变，我仍然在推动它，因为持续时间已经改变。

我应该仅在添加新项目或删除项目时将项目推送到客户端。但不知何故，我需要在客户端更新持续时间。我可以想到几种方法来做到这一点，例如有一个在后台运行的定时服务，并将操作发送到 redux 存储以更新所有项目的持续时间。但不确定这是否是一个好方法，有人可以建议吗？

是的，定期调度操作的后台服务是执行此操作的明显方法。如有必要，您可以通过侦听对 Redux 状态的更改来启用/禁用服务自身。

正如我在注释中所述，您可以在组件的render()方法中计算持续时间。 即您当前的代码是：

    render() {
       return this.props.items.map(item => <Duration duration={item.duration}>)
    }

你像new Date().getTime() - item.created_at一样计算持续时间.因此，您可以计算持续时间 render() 并每 10 秒强制更新组件：

   componentDidMount() {
     setInterval(this.forceUpdate.bind(this), 10000); //re-render component every 10 seconds
   }
   render() {
     const now = new Date().getTime();
     return this.props.items.map(item => <Duration duration={now - item.created_at}>)
   }
相关文章：