[英]React Router - Invalid prop `children` supplied to `Router` when composing routes
Why is it that when I supply the routes within the router all is good but when I compose the routes like below I get a 为什么当我在路由器中提供路由时一切都很好,但是当我编写如下所示的路由时却得到一个
warning.js:36 Warning: Failed prop type: Invalid prop
children supplied to
Router . in Router (at index.js:62) in Root (at index.js:70)
warning.js:36 Warning: Failed prop type: Invalid prop
supplied to
Router的warning.js:36 Warning: Failed prop type: Invalid prop
子warning.js:36 Warning: Failed prop type: Invalid prop
. in Router (at index.js:62) in Root (at index.js:70)
. in Router (at index.js:62) in Root (at index.js:70)
and a 和一个
browser.js:49 Warning: [react-router] Location "/contact" did not match any routes
import React, { PropTypes, Component } from 'react';
import ReactDOM from 'react-dom';
import { Router, Route, Link, IndexRoute, browserHistory } from 'react-router';
class Navigation extends Component {
render() {
return (
<div>
<ul>
<li><Link to='/'>Main</Link></li>
<li><Link to='/about'>About</Link></li>
<li><Link to='/contact'>Contact</Link></li>
</ul>
</div>
);
}
};
class Contact extends Component {
render() {
return <div>Contact</div>;
}
}
class About extends Component {
render() {
return ( <div>About</div> );
}
}
class Home extends Component {
render() {
return <div>Home</div>;
}
}
class App extends Component {
render() {
return (
<div>
<h1>App</h1>
<Navigation />
{this.props.children}
</div>
);
}
}
const routes = () => (
<Route path='/' component={App}>
<IndexRoute component={Home} />
<Route path='about' component={About} />
<Route path='contact' component={Contact} />
</Route>
)
export default class Root extends Component {
render() {
return (
<Router history={browserHistory}>
{routes}
</Router>
);
}
}
ReactDOM.render(
<Root />,
document.getElementById('root')
)
I've tried just about all variations. 我已经尝试了几乎所有变体。 Is it possible to compose routes?
是否可以撰写路线? Any help appreciated.
任何帮助表示赞赏。
export default class Root extends Component { render() { return ( <Router history={browserHistory}> {routes()} </Router> ); } }
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.