Reactjs 未捕获错误：不变冲突：元素类型无效：对象

我正在修补

react路由器

，试图实现简单的路由。我按照他们的示例中所写的方式键入代码（但不使用

import

s）

我在浏览器中遇到这个错误：

未捕获错误：不变冲突：元素类型无效：需要字符串（对于内置组件）或类/函数（对于复合组件），但得到：对象

这就是我要做的

我在页面上附加脚本，

ReactRouter.min.js

和

react routes.js

中的我的代码。还有

react

和

react dom

和jquery（这三个都在

app.js

中）：

这是我用Babel编译后的

react router.js

。我在页面上附上以下内容：

babel——预设反应-o public/js/react-routes.js assets/js/react-routes.js

：

<script src="/js/app.js" type="text/javascript" charset="utf-8"></script>
<script src="https://npmcdn.com/react-router/umd/ReactRouter.min.js"></script>
<script src="/js/react-routes.js" type="text/javascript" charset="utf-8"></script>

'use strict';

window.Router = window.ReactRouter;
window.Link = window.ReactRouter.Link;
window.Route = window.ReactRouter.Route;

const Foo = React.createClass({
    displayName: "Foo",

    render() {
        return React.createElement(
            "div",
            null,
            React.createElement(
                "h1",
                null,
                "HELLO, me FOO"
            )
        );
    }
});

// Error is thrown here, in this line
ReactDOM.render(React.createElement(
    Router,
    null,
    React.createElement(
        Route,
        { path: "/" },
        React.createElement(Route, { path: "/page/one", component: Foo })
    )
), document.getElementById('content-section'));

我做错了什么？为什么会抛出错误？路由器是一个对象，而不是一个组件。为什么？我查看这个示例，并以与您相同的方式键入代码

window.Router=window.Router；

应该是

window.Router=window.ReactRouter.Router；

---

出现错误是因为您试图使用

，但

路由器

是对React路由器库的引用（而不是

路由器

组件）。

是的，您是对的。但是这个路由器库生成了一些疯狂的URL

localhost/#/？_k=gt80ji

。这是荒谬的。在他们的文件里什么都没有看到

'use strict';

window.Router = window.ReactRouter;
window.Link = window.ReactRouter.Link;
window.Route = window.ReactRouter.Route;

const Foo = React.createClass({
    displayName: "Foo",

    render() {
        return React.createElement(
            "div",
            null,
            React.createElement(
                "h1",
                null,
                "HELLO, me FOO"
            )
        );
    }
});

// Error is thrown here, in this line
ReactDOM.render(React.createElement(
    Router,
    null,
    React.createElement(
        Route,
        { path: "/" },
        React.createElement(Route, { path: "/page/one", component: Foo })
    )
), document.getElementById('content-section'));