首页 > 解决方案 > 即使在reactjs中的组件之间切换后如何保持下拉选项值?

问题描述

所以基本上我有两个标签视图或 2 个标签。第一个选项卡有多个下拉菜单,第二个下拉菜单没有任何内容。因此,如果我从具有下拉菜单的选项卡中选择值并切换到第二个选项卡,那么我选择的值就消失了。基本上没有被维持的状态。

我的问题是即使我在选项卡之间切换,如何维护所选下拉列表的状态或值

使用基本的 reactjs 解决方案,没有 redux 或 hooks。

标签: reactjsdropdown

解决方案


您所描述的是一个问题全局状态解决方案,例如 redux 解决。由于您想使用香草反应解决方案,我建议将状态提升到两个组件的父级或使用 Context API - 您可以在此处阅读有关 Context 的信息:https ://reactjs.org/docs/context.html #reactcreatecontext

提升状态基本上意味着将您声明状态的位置和更改状态的函数移动到两个组件的父级。然后,您可以将状态更改状态的函数作为道具传递,从而允许两个组件共享该状态并具有更改状态的能力。

如果这只是少量数据或简单的事情,我会选择提升状态。如果它会随着时间的推移而增长,我会使用 Context。

祝你好运!


推荐阅读