拨开荷叶行,寻梦已然成。仙女莲花里,翩翩白鹭情。
IMG-LOGO
主页 文章列表 如何根据您所在的路线呈现条件导航栏链接?

如何根据您所在的路线呈现条件导航栏链接?

白鹭 - 2022-03-11 2108 0 0

我的反应站点基本上由两条路线组成。主页,然后是联系页面。我正在使用 react-router-dom 在两条路由之间切换。如果我在联系人页面上,如何让导航栏显示“关闭”而不是联系人。

uj5u.com热心网友回复:

假设导航栏是它自己的一个组件(如果它不只是改变值),你可以从你的每个页面传入一个具有不同值的道具,例如一个名为 currentPage 的道具,你可以从home route 和 contact route 中的“contact”,并使用导航栏中的三元运算子来决定显示哪一个。类似的东西props.currentPage == "home ? "Contact" : "Close"希望这在某种程度上有所帮助。

uj5u.com热心网友回复:

在不了解您的代码结构的情况下很难提供答案。

react-router-dom提供多种可以使您的目标受益的选项。我建议您首先查看路径道具和钩子中match物件和useRouteMatch钩子或location属性useLocation

标签:

0 评论

发表评论

您的电子邮件地址不会被公开。 必填的字段已做标记 *