Type/Case 在 React-Router 中使用错误

Question

我试图将一个应用程序移动到 React-Router，但一直出现错误。然后我尝试了一个从 github repo 获得启发的简单示例，但得到了同样的错误。可能是一个愚蠢的错误，但我一直在重新阅读代码，但找不到它有什么问题。

错误：

Warning: React.createElement: type should not be null or undefined. It should be a string (for DOM elements) or a ReactClass (for composite components).
Warning: Only functions or strings can be mounted as React components.
Uncaught TypeError: Cannot read property 'toUpperCase' of undefined

代码：

var React = require('react');
var Router = require('react-router');
var DefaultRoute = Router.DefaultRoute;
var Link = Router.Link;
var Route = Router.Route;
var RouteHandler = Route.RouteHandler;

var Inbox = React.createClass({
    render: function () {
        return (
            <div>Inbox</div>
        )
    }
});

var Calendar = React.createClass({
    render: function () {
        return (
            <div>Calendar</div>
        )
    }
});

var Dashboard = React.createClass({
    render: function () {
        return (
            <div>Dashboard</div>
        )
    }
});

var App = React.createClass({
  render: function () {
    return (
      <div>
        <header>
          <ul>
            <li><Link to="app">Dashboard</Link></li>
            <li><Link to="inbox">Inbox</Link></li>
            <li><Link to="calendar">Calendar</Link></li>
          </ul>
          Logged in as Jane
        </header>

        {/* this is the important part */}
        <RouteHandler/>
      </div>
    );
  }
});

var routes = (
  <Route name="app" path="/" handler={App}>
    <Route name="inbox" handler={Inbox}/>
    <Route name="calendar" handler={Calendar}/>
    <DefaultRoute handler={Dashboard}/>
  </Route>
);

Router.run(routes, function (Handler) {
  React.render(<Handler/>, document.getElementById('app'));
});

Answer 1

您缺少 r。这：var RouteHandler = Route.RouteHandler; 应该是 var RouteHandler = Router.RouteHandler; 因为 RouteHandler 在 Router 对象上而不是在 Route 对象上。

Type/Case 在 React-Router 中使用错误

Type/Case Errors using in React-Router

reactjs

react-router