需要关于从零售商店价值初始化组件中的本地状态的建议

我正在使用react/redux实施客户编辑表单页面。我将在componentDidMount方法中提取与客户ID相关的客户详细信息，并将客户相关数据存储在redux商店中。

我想在客户编辑表单页面中使用该数据集作为模型，并且想要使用我已存储在redux存储中的客户数据初始化本地状态。

我想知道，在哪个组件中应该这样做（将redux存储模型设置为本地状态）？在构造函数里面做正确吗？需要关于从零售商店价值初始化组件中的本地状态的建议

来源

2017-08-04 Anna

如果您想在本地状态下使用componentDidMount进行初始化，但您始终可以从存储中获取并直接在商店中更新它 –

是否直接更新商店是否正确？ – Anna

为什么不，你确定可以更新状态，但是发送动作并通过减速器更新 –

这要看你的行动有点被设计和这个组件中的本地状态实际上是什么。

当用户更改表单中的输入值时，是否要立即将这些更改存储在redux存储中？还是想等到他们用一个按钮进行确认，或者可以以一定的时间间隔自动保存更改？

有可能更新了Redux店上每按键用户执行的形式 - 但你会解雇了很多动作。在这种情况下，根本不需要组件状态，通过mapStateToProps和mapDispatchToProps连接到redux商店的道具就足够了。所有输入都是受控输入。
如果您的组件在将表单中的更改传播到redux存储区之前有一些内部逻辑要运行，则必须在constructor或componentWillReceiveProps中克隆表单。这取决于您的应用程序如何使用CustomerEditForm组件。
1. 如果您使用constructor，则在用户更改表单时，不会从redux商店获取更新。想象一下另一个用户编辑同一个客户，但你的组件不会知道它，因为它不再看this.props.customerForm。
2. 如果您使用的是componentWillReceiveProps，则必须处理使表单与redux商店保持同步。想象一下，有一个输入customerName，你原来从this.props.customerForm.customerName得到它的值。现在，此值可能在this.state.customerForm.customerName（因为用户对输入进行了更改）中发生了更改，但也在nextProps.customerForm.customerName（因为其他人进行了更改）中发生了更改。现在你必须决定显示或放弃什么。

我建议你去与方案1.如果可能的话，只保留UI状态在组件的本地状态（类似“下拉菜单打开”）。

来源

2017-08-04 08:34:10 timotgl

感谢您的信息。 :) – Anna

你也可以在构造函数中完成它，但是当你使用REDX时，在store中设置你的状态然后从它检索数据将是我会推荐的解决方案，因为它会更灵活。

万一

您设置状态组件，它会做不必要的渲染，即使你不希望这样的行为，如果你的状态changes.So商店将是一个更好的选择

来源

2017-08-04 05:45:55

需要关于从零售商店价值初始化组件中的本地状态的建议

回答

相关问题