gpt4 book ai didi

reactjs - React-Router 和 Flux - 转换时清除状态

转载 作者:行者123 更新时间:2023-12-03 13:41:19 25 4
gpt4 key购买 nike

我正在使用带有 Flux 架构的 React-router(Facebook 的 Flux 实现)。

目前在我的系统中,我有一条显示“chat/:topic”的路线。

当用户输入此组件时,我将创建一个到 Websocket 服务器的订阅(在 componentWillMount 上使用操作创建),并删除在 componentWillUnmount 上的订阅。

当用户移动到另一条路线时,整个工作流程工作正常 - 因为 react 路由器正在卸载我的组件。

当我在路线内转换(从“聊天/游戏”到“聊天/电视”)时,该组件未安装,我需要清除组件的状态。

我读到了我可以采取的不同操作,并且在转换时调度一个操作“TRANSITION”,并且每个相关商店都会清除它的商店。

在我看来,这种行为是错误的,它将我的商店和我的路由器耦合在一起。

你会如何解决这个问题?这是我应该向 react 路由器提出并要求他们在我的 route 卸载的问题吗?

最佳答案

感谢 gaearon ( https://github.com/gaearon/ ),我找到了答案,

使用存储来保留选定的主题并向消息存储请求消息,在不断变化的情况下,您不应该从存储中删除任何内容,除非出于性能原因需要它。

在我的应用程序中,我必须删除消息(因为它们是大对象)并清除我的订阅(以减少服务器上的负载)。

为了实现这一目标,我找到了三种解决方案:

  1. 使用 componentWillReceiveProps 并检查参数是否更改,如果参数更改 - 执行任何您需要的操作以清除存储 - 例如调用 ActionCreator 并重置状态。
  2. 在转换过程中发送一个处置负载(在 Router.run 内),这将告诉所有存储自行清除。
  3. 最后一个解决方案(我使用的)确保我的组件已卸载 - 为什么?清除 componentWillReceiveProps/dispose 上的状态太容易出错,而确保组件已卸载会更清晰。

有关如何实现此目的的详细信息:

https://github.com/rackt/react-router/issues/292

https://github.com/rackt/react-router/issues/496#issuecomment-64152941

关于reactjs - React-Router 和 Flux - 转换时清除状态,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30583519/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com