在 React 中动态更新导航栏和侧栏的最佳方法是什么?
What is the best way to dynamically update Navigation bar and side bar in React?
我为我的 React 应用程序创建了一个布局组件,我想在路由更改时动态更新侧边栏和导航栏。
我可以使用 redux,但所有状态和方法都将始终可用,即使我不需要它们。
我也看了新的react context,和redux一样的问题
使用 React 路由器,看起来我只是安装了一个新的侧边栏或导航栏。
有没有办法为我的布局组件动态提供新的状态和方法?
(用不同的状态替换状态,或者多个新的一次:apple --> orange)
React 路由看起来是我的最佳选择,但我可以通过在每个新路由中包含侧边栏和导航栏来做同样的事情。
动态添加 links 不是问题,添加影响新安装组件的按钮才是问题。导航栏和侧边栏位于父组件中,因此它们需要知道所有的状态和方法。
谢谢,
编辑:
示例:
- 主页 - 关于 - 联系方式
没问题,link。我可以使用 switchComponet 方法将 link 组件替换为任何其他组件。
停止 - 加速 - 帮助
这些都是按钮。现在我需要将它们的方法和状态添加到 Layout 组件中。随着应用程序的增长,更多的状态和方法将需要添加到顶级组件。
我可以将它们全部放在 redux 中,但所有状态和方法始终可用。我可能对redux有错误的印象,我认为它可能会占用很多资源,但我可能错了。
我猜 "state and methods" 你指的是布局组件中 react-redux connect 函数的 mapStateToProps 和 mapDispatchToProps 参数。
如果是这种情况,那么您有理由担心将布局的所有可能内容的逻辑放在那里。
我认为你的问题是你假设你只需要将顶级容器连接到 redux,而事实并非如此。
您可以连接您的布局组件来处理导航栏和侧边栏,同时让组件嵌套在您的布局组件中并使用它们自己的商店键(商店状态的一部分)和操作连接到 redux。
这样您就不需要添加每个布局内容所需的所有商店状态和操作。每个布局内容将保持接近其逻辑。
这实际上是 redux 的目的之一。
我为我的 React 应用程序创建了一个布局组件,我想在路由更改时动态更新侧边栏和导航栏。
我可以使用 redux,但所有状态和方法都将始终可用,即使我不需要它们。
我也看了新的react context,和redux一样的问题
使用 React 路由器,看起来我只是安装了一个新的侧边栏或导航栏。
有没有办法为我的布局组件动态提供新的状态和方法?
(用不同的状态替换状态,或者多个新的一次:apple --> orange)
React 路由看起来是我的最佳选择,但我可以通过在每个新路由中包含侧边栏和导航栏来做同样的事情。
动态添加 links 不是问题,添加影响新安装组件的按钮才是问题。导航栏和侧边栏位于父组件中,因此它们需要知道所有的状态和方法。
谢谢,
编辑:
示例:
- 主页 - 关于 - 联系方式
没问题,link。我可以使用 switchComponet 方法将 link 组件替换为任何其他组件。
停止 - 加速 - 帮助
这些都是按钮。现在我需要将它们的方法和状态添加到 Layout 组件中。随着应用程序的增长,更多的状态和方法将需要添加到顶级组件。 我可以将它们全部放在 redux 中,但所有状态和方法始终可用。我可能对redux有错误的印象,我认为它可能会占用很多资源,但我可能错了。
我猜 "state and methods" 你指的是布局组件中 react-redux connect 函数的 mapStateToProps 和 mapDispatchToProps 参数。
如果是这种情况,那么您有理由担心将布局的所有可能内容的逻辑放在那里。
我认为你的问题是你假设你只需要将顶级容器连接到 redux,而事实并非如此。
您可以连接您的布局组件来处理导航栏和侧边栏,同时让组件嵌套在您的布局组件中并使用它们自己的商店键(商店状态的一部分)和操作连接到 redux。
这样您就不需要添加每个布局内容所需的所有商店状态和操作。每个布局内容将保持接近其逻辑。
这实际上是 redux 的目的之一。