Question

我无法正确导入RouteHandler。这是我的代码：

var React = require('react');
var ReactDOM = require('react-dom');
var ReactRouter = require('react-router');
var ActivityView = require('./ActivityView');

var Router = ReactRouter.Router;
var Route = ReactRouter.Route;
var Link = ReactRouter.Link;
var RouteHandler = ReactRouter.RouteHandler;
var hashHistory = ReactRouter.hashHistory;
var IndexRoute = ReactRouter.IndexRoute;

var App = React.createClass({
    render: function() {
        return (
            <div>
                <div className="navbar navbar-default">
                    <ul className="nav navbar-nav navbar-right">
                        <li><Link to="app">Dashboard</Link></li>
                    </ul>
                </div>

                <RouteHandler />
            </div>
        );  
    }   
});

ReactDOM.render(
    <Router history={hashHistory}>
        <Route name="app" path="/" component={App}>
            <IndexRoute component={ActivityView} />
        </Route>
    </Router>,
    document.getElementById('content')
);

我一直收到错误：

警告：React.createElement：type不应为null，undefined，boolean或number。它应该是一个字符串（对于DOM元素）或一个ReactClass（对于复合组件）。检查App的呈现方法。

如果我删除<RouteHandler />此警告消失且导航栏呈现。我在这里错误地导入了RouteHandler吗？

Answer 1

根据upgrading guide

中的部分

RouteHandler 消失了。路由器现在会根据活动路径自动填充this.props.children组件。

// v0.13.x
<RouteHandler/>

// v1.0
{this.props.children}

与从其父级接收子级的所有其他React组件一样，您可以使用标准的React.cloneElement模式将其他道具注入您提供的子级。

通常应避免过度使用此模式，因为这会通过渲染树而不是路由树将路径组件紧密耦合，这会使重构变得更加困难。

Link to complete Documentation

React-Router RouteHandler未定义

1 个答案: