首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >在React中动态更新导航栏和侧边栏的最佳方式是什么?

在React中动态更新导航栏和侧边栏的最佳方式是什么?
EN

Stack Overflow用户
提问于 2018-09-18 07:33:12
回答 1查看 969关注 0票数 0

我为我的react应用程序创建了一个布局组件,并希望在路线更改时动态更新侧边栏和导航栏。

  1. 我可以使用redux,但所有状态和方法都将随时可用,即使我不需要它们。
  2. 我还查看了新的react上下文,但它具有与redux相同的问题。
  3. 使用react路由器,看起来我只是挂载了一个新的侧边栏或导航栏。

有没有办法动态地给我的布局组件提供新的状态和方法?

(将状态替换为不同的状态,或多个新的状态: apple --> orange)

React路由器看起来是我最好的选择,但我也可以做同样的事情,只需在每条新的路由中添加侧边栏和导航栏。

动态添加链接不是问题,添加影响新安装的组件的按钮才是问题。导航栏和侧边栏位于父组件中,因此它们需要知道所有的状态和方法。

谢谢,

编辑:

示例:

-主页-关于-联系人

没有问题,有链接。我可以使用switchComponet方法将链接组件替换为任何其他组件。

停止-加速-帮助

这些都是按钮。现在,我需要将它们的方法和状态添加到布局组件中。随着应用程序的增长,将需要向顶部组件添加更多的状态和方法。我可以把它们都放在redux中,但是所有的状态和方法都是可用的。我可能对redux有错误的印象,我认为它可能会占用很多资源,但我可能是错的。

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2018-09-18 08:12:31

我猜“状态和方法”指的是布局组件中react-redux连接函数的mapStateToProps和mapDispatchToProps参数。

如果是这样的话,你就有理由担心将布局的所有可能内容的逻辑放在那里。

我认为你的问题是,你假设你只需要将顶层容器连接到redux,而事实并非如此。

您可以连接您的布局组件来处理导航和侧边栏,同时将组件嵌套在您的布局组件中,并使用它们自己的存储键(存储状态的一部分)和操作连接到redux。

这样你就不需要添加每个布局内容所需的所有存储状态和操作。每个布局内容都将与其逻辑保持一致。

这实际上是redux的目的之一。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/52376959

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档