javascript - 从另一个组件切换状态

Question

我对 React 和 Redux 还很陌生，所以我可能完全以错误的方式做这件事，事实上，从这里类似问题的其他一些答案来看，我怀疑我做错了很多。

我的“布局”组件中有一个按钮，它将一个类添加到 div，这个类来自一个状态。该按钮是一个切换按钮，将打开和关闭状态和类(这将导致出现菜单并使页面的其余部分变暗)。

但是，我还希望与“导航”组件(位于“标题”组件内，而“标题”组件又位于“布局”中)进行任何交互，以切换状态和类(因此单击链接会折叠菜单)。在 jQuery/VanillaJS 中，这非常简单，但我似乎无法找出 React/Redux 的方法。

布局组件:https://pastebin.com/WzpbeSw7

header 组件:https://pastebin.com/c34NFtUx (可能不相关，但仅供引用)

导航组件:https://pastebin.com/EsJDuLQc

Answer 1

通过使用 redux :

你可以有一个像toggleBlaBla这样的状态:“show”。如果您使用react-redux将您的react组件连接到redux状态，则每当您调度将toggleBlaBla更改为“隐藏”的操作时，您连接的组件都会重新渲染。

仅使用 react :

如果您希望两个组件通过某些事件更改某些 ui 状态，最好将它们放入容器组件中，这样每当您的状态更改时，这两个组件就会重新渲染，并将更改后的状态传递给这两个组件。