阵营路由器副路径调用不同的父路由
问题描述:
阵营路由器阵营路由器副路径调用不同的父路由
我有一个副路径设置的4版本:/profile/agree
和子路径上我想要一个<Link>
标签去/team
。
这是建立现在这样父页面:
<Router>
<Switch>
<Route exact path="/" component={Home} />
<Route path="/profile" component={Profile} />
<Route path="/team" component={Team} />
</Switch>
</Router>
而且成型件有它自己的路由:
<Router>
<Switch>
<Route exact path="/profile" component={General} />
<Route path="/profile/hotel" component={Hotel} />
<Route path="/profile/release" component={Release} />
</Switch>
</Router>
这是否是正确与否,我不知道,因为没有一个文档似乎可以解释这种类型的场景,但它对我来说很有意义。反正当“释放”部分有一个简单的链接,它似乎并不正确导航,只是显示一个空白页:
<a href="/team">Somehow</a> {/* << This works but refreshes the whole page */}
<Link to="/team">Of Course</Link> {/* << This just shows empty profile page /*}
我想也许子路由器只能仰望高达本身,所以也许:
<Link to="../team">Of Course</Link>
但是,做了同样的事情。它似乎仍然保留在“简介”主要路线上。如何导航到不同的父路线?
答
所以我最终想出了我有的简单错误。 Profile中有<Router>
的事实!
这样做曾在个人资料(简单地删除路由器标签):
<Switch>
<Route exact path="/profile" component={General} />
<Route path="/profile/hotel" component={Hotel} />
<Route path="/profile/release" component={Release} />
</Switch>
这给了我什么,我认为是最有意义的。每个“场景”负责它自己的路由。唯一的缺点是它仍然需要/profile
,尽管我可能会狡猾并将“根”作为属性发送到场景中。
你在文档中看到过这个吗? https://reacttraining.com/react-router/web/example/route-config – taylorc93
是@ taylorc93,但它似乎有点混乱。你必须创建某种“带子路由的路由”组件似乎很奇怪。我会尝试写出他们所拥有的东西,并且仔细观察以了解什么/为什么这样做。例如:为什么他们有路径的JSON定义而不是嵌套元素?我也希望每条路线都能处理它自己的路由(不是一个人都知道)......这是一件奇怪的事情吗?我在思考类似于ExpressJS的路由模式。每条路线都不在乎根源是什么,它们只是将更多的东西添加到任何地方。 – Chris