我有一些使用react-router-dom
版本4.2.2的嵌套路由,并且我想在根路由上提供一个“后退”按钮。例如,如果我的层次结构是
/base/:id
:表示资源的索引页,链接并有条件地呈现内部活动
/base/:id/some-inner-activity
:代表一个内部活动的页面/base/:id/some-other-inner-activity
:代表另一个内部活动的页面我希望能够提供由基本组件呈现的链接,该链接只会使您回到/base/:id
,因此所有活动都可以具有共享的“后退”或“向上”行为。我可以使用/base/${match.params.id}
来做到这一点,但这意味着我必须在基本组件中对/base/
进行硬编码,因此,如果我要更改其所在的路线,则会有很多断开的链接
我希望能够将match.path
与match.params
一起使用,但是我不确定如何以React Router认可的方式进行此操作,我当然不会不想自己实现。
我整理了一个代码沙箱,展示了我的首选行为,但是您会注意到,在Base
组件中,我仍然必须对/base/
字符串进行硬编码以生成后退按钮URL。
答案 0 :(得分:0)
反应路由器提供generatePath,可以称为generatePath(match.path, match.params)
。
请注意,这不适用于TypeScript,因此您可能必须执行generatePath(match.path, match.params as {[paramName: string]: string;})
或类似的操作。
答案 1 :(得分:0)
您可以尝试引用props.params.whateveridyouwant
另一种方法是将match.params推送到redux存储,以便您可以在应用程序中的任何位置访问它。
希望这会有所帮助!或者引导您朝正确的方向前进!