使用重新水化的Redux商店从道具初始化状​​态

时间:2018-08-09 10:16:07

标签: reactjs redux material-ui

在我的应用程序中,我有一个对话框窗口,上面有多个输入字段。我想做的是将用户输入保存为组件自己的状态,并且仅此后,例如,在对话框的“ onClose”内部使用“调度”功能将输入发送到Redux存储。 >

通过这种方式,对话框组件将字段数据保持在其自身状态内。 我面临的问题是我不确定从redux存储中包含的信息重建对话框组件状态的最佳方法是什么。

如果使用F5刷新页面或只是重新加载页面,那么组件将失去其状态,并且字段将显示为空白,无论重新水化的Redux存储区仍然包含有效的输入信息。

那么问题是,从props设置组件状态的最佳方法是什么?而且,它看起来像不是反模式吗?这种任务有哪些常用技术?

一种可能性是将字段值直接设置为“ props”中包含的值。但是,这意味着输入字段的每一个小变化都会导致复制和修改redux存储,这是缓慢且效率低下的。

1 个答案:

答案 0 :(得分:1)

通常,根据道具建立状态会使代码复杂化,您必须同时在$headers = ["X-YourApp-Signature" => "your_signature_string"]; $data = json_encode(["foo" => "bar"]); $request = new \GuzzleHttp\Psr7\Request("POST", "https://example.com", $headers, $data); $client = new \GuzzleHttp\Client(); $response = $client->send($request, ["timeout" => 10]); var_dump($response); constructor中映射道具。

我更喜欢编写组件函数,这些组件函数根据传递的prop返回值。

正如您提到的那样,这可能会影响性能,可以使用memoize-one library对其进行修复。

有关更多详细信息,您可以check the following answer