Question

我正在尝试从react-router 0.13升级到1.0。我仔细阅读了指南并相信我已正确设置了所有内容，但我一直收到此错误：

Uncaught TypeError: Cannot read property 'createRouteFromReactElement' of undefined

错误对应于react-router中的此功能：

    function createRoutesFromReactChildren(children, parentRoute) {
  var routes = [];

  _react2['default'].Children.forEach(children, function (element) {
    if (_react2['default'].isValidElement(element)) {
      // Component classes may have a static create* method.
      if (element.type.createRouteFromReactElement) {
        var route = element.type.createRouteFromReactElement(element, parentRoute);

        if (route) routes.push(route);
      } else {
        routes.push(createRouteFromReactElement(element));
      }
    }
  });

  return routes;
}

据推测，这意味着路线没有正确传递给this.props.children？

如果有帮助，这就是我的路线：

var routes = (
  <Route path="/" component={AppView}>
    <Route path="account" component={Account} />
    <Route path="insights" component={InsightsHome} />
    <Route path="insights/:slug" component={SingleInsight} />

    <Route path="collections" component={CollectionBox}>
      <Route path="/:id" component={CollectionContent} />
      <DefaultRoute component={NoCollections} />
    </Route>

    <Route path="team" component={Team} />

    <Redirect from="projects/:projectId/insights/?" to="insights" />
    <Redirect from="projects/:projectId/insights/:slug/?" to="insights-single" />
    <Redirect from="*" to="insights" />
  </Route>
);

这是我的render方法（我正在使用Redux）：

ReactDOM.render(
  <Provider store={store}>
    <Router history={history}>{routes}</Router>
  </Provider>,
  document.getElementById('site-container')
);

以下是我AppView组件的相关部分：

return (
      <div>
        {this.props.children}
      </div>
    )
  },

Answer 1

您的问题可能源于DefaultRoute替换为IndexRoute

https://github.com/rackt/react-router/blob/master/CHANGES.md#linking-to-index-routes

react-router 1.0：使用this.props.children而不是RouteHandler

1 个答案: