Javascript 使用React Router v4是否可以在子组件中创建多级路由？

所以我对React框架还比较陌生，我决定使用Router v4，尽管它是测试版，在撰写本文时，它似乎是最好的方式

我有一个路由器，它显示了两个组件中的一个

import React from 'react';
import { HashRouter as Router, Route } from 'react-router-dom';
import Category from './category/Category';
import Hist from './hist/Hist';

const Controls = React.createClass({
  render: function() {
    return (
      <Router>
        <div>
          <Route path='/category/:categoryId' component={Category}} />
          <Route path='/Hist' component={Hist} />
        </div>
      </Router>
    );
  }
});

export default Controls;

有没有可能完成这样的特技表演，或者有没有人给我其他好的建议

或者，这是重新思考和实现某种条件渲染的最佳解决方案，具体取决于我作为道具从第一个路由器到达类别组件的路径

---

更新：

我意识到

似乎不接受内容，所以我添加了一个名为Display的组件，并将其导入如下：

import React from 'react';
import { Route, Link } from 'react-router-dom';
import Display

const Category = React.createClass({
  render: function() {
    return (
      <div>
        <ul>
          <li><Link to='/category/1'>Category 1</Link></li>
          <li><Link to='/category/2'>Category 2</Link></li>
        </ul>
        <div className='category-display'>
          <Route path='/category/1' component={Display} />
          <Route path='/category/2' component={Display} />
        </div>
      </div>
    );
  }
});

从“React”导入React；
从'react router dom'导入{Route，Link}；
导入显示
const Category=React.createClass({
render:function（）{
返回(

第一类
第2类

);
}
});

---

但是，不渲染显示。任何关于为什么会这样的想法都将不胜感激。

所以事实证明，我的更新（见上面的问题）起到了作用。这里的显示组件出了故障，而不是路由器

因此，如果有其他人偶然发现了这一点，请回顾一下：

不接受任何内容，可以使用

的

渲染

功能进行一些快速测试。每件事都在报告中进行了简洁的总结

---

干杯

原来路由器不接受任何内容，所以我实现了一个组件，就像在控制组件中一样。仍然无法100%工作，似乎没有任何效果，我将继续尝试。

Uncaught Error: React.Children.only expected to receive a single React element child.

import React from 'react';
import { Route, Link } from 'react-router-dom';
import Display

const Category = React.createClass({
  render: function() {
    return (
      <div>
        <ul>
          <li><Link to='/category/1'>Category 1</Link></li>
          <li><Link to='/category/2'>Category 2</Link></li>
        </ul>
        <div className='category-display'>
          <Route path='/category/1' component={Display} />
          <Route path='/category/2' component={Display} />
        </div>
      </div>
    );
  }
});