reactjs - 反应 - 路由器和通量 - 转换时的清除状态

时间：2015-06-01 21:21:41

标签： reactjs reactjs-flux flux react-router

我正在使用flux-router和flux体系结构（facebook＆＃fs flux实现）。

目前在我的系统中，我的路线上写着＆＃34; chat /：topic＆＃34;。

当用户进入此组件时，我正在创建订阅（使用actionWillMount上的操作创建）到websocket服务器，我正在删除componentWillUnmount上的订阅。

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

当我在我的路线内转换时（从＆＃34;聊天/游戏＆＃34;到＆＃34;聊天/电视＆＃34;），组件未安装，我需要清除我的状态组件。

我读到了我可以采取的不同行动以及过渡到派遣行动的过程＆＃34; TRANSITION＆＃34;每个相关的商店都会清理它的商店。

在我看来，这种行为是错误的，它将我的商店和路由器联系在一起。

你会如何解决这个问题？这是一个我应该提出反应路由器并让他们在我的路线内卸载的问题吗？

答案 0 :(得分：6)

，我找到了答案

使用商店保留所选主题并向消息存储区询问消息，因此您不应从商店中删除任何内容，除非出于性能原因需要

。

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

为了达到这个目的，我找到了三种解决方案：

使用componentWillReceiveProps 并检查参数是否已更改，是否更改参数 - 执行任何操作以清除商店 - 例如调用ActionCreator并重置状态。
在转换中发送一个dispose有效负载（在Router.run中），这将告诉所有商店自行清除。
最后一个解决方案（我使用过）确保我的组件已卸载 - 为什么？在componentWillReceiveProps / dispose上清除状态太容易出错，只需确保卸载组件就更容易了。

如何实现这一目标的详细信息：

答案 1 :(得分：1)

我相信compomentWillReceiveProps可能会解决您的问题。这就是路由器用来将内容传递给你的反应。

答案 2 :(得分：1)

据我所知，你需要同时使用componentWillReceiveProps和componentDid / WillMount来捕获初始渲染。

我焦急地等待react-router 1.0发布（本周末？），希望有更优雅的方式来实现这一目标。