固定路线未呈现，所分配的分量

这里是路由器设置固定路线未呈现，所分配的分量

<Route path="/" component={App}> 
    <Route path="/pages(/:section)" component={ Pages }> 
    <Route path="/pages/category" component={ Pages.Category }/> 
    <Route path="/pages/editor(/:uid)" component={ Pages.Editor }/> 
    </Route> 
</Route>

的Pages组分包含Menu元器件这就需要激活按钮取决于section。这里奇怪的是组件Pages.Category没有在props.children的Pages中传递，所以它根本没有被渲染。只要我从path="/pages(/:section)"中删除(/:section)，就会按预期呈现Pages.Category。编辑器路由相同。这是预期的行为？难道我做错了什么？

来源

2016-08-10 Eduard Jacko

你的代码是混乱的。如果您正在嵌套路由，则不需要再次在嵌套路由路径中指定“页面”。除非路径匹配'pages/section/pages/category'，否则Pages.Category不会被渲染。另外，我不认为这是一个好主意，以可选路径 – Deadfish

嵌套在路线下我相信你是错的。您可以在嵌套路线中的任何位置设置绝对路径。这工作正常。 –

我没有说你的代码不行。我的意思是很难推理 – Deadfish

是的，从我的经验来看，这是预期的行为。您的<Route path="/pages(/:section)" component={ Pages }>是一个路线组。您只能定义基准网址。现在你的路由器匹配这个路由并显示'Pages'组件。它显示第一场比赛，这是第一场比赛。你的代码应该是这个样子有团体合作：

如果路由使用相对路径，它建立：
<Route path="/" component={App}> 
    <Route path="pages" component={ Pages }> 
    <Route path="category" component={ Pages.Category }/> 
    <Route path="editor(/:uid)" component={ Pages.Editor }/> 
    </Route> 
</Route> 
你不能在一个绝对的上构建一个URL在祖先积累的道路上。通过使用绝对路径，嵌套路由可以选择退出此行为。

现在，您无法直接访问“页面”组件中的哪个页面，但可以从this.props.location.pathname读取当前的完整路径。随着正则表达式的一点点，你可以找到当前显示的组件：

this.props.location.pathname.match(/([a-z0-9]+)/g)[1] 
// Will give 'category' or 'editor'

我有一个工作为例对CodePen：http://codepen.io/loico/pen/VjqKvg#/pages/category

来源

2016-08-10 15:17:12

固定路线未呈现，所分配的分量

回答

相关问题