React Router Error: Invalid prop `component` supplied to `Route`
React Router Error: Invalid prop `component` supplied to `Route`
当我在浏览器上 运行 我的应用程序时,我在控制台中收到以下错误。
Warning: Failed propType: Invalid prop 'component' supplied to 'Route'.
我目前使用的是以下开发需求的版本
react v0.14.8
react-router v2.3.0
Webpack v1.13.0
babel-loader v6.2.4
babel-core v6.7.7
babel-preset-es2015 v6.6.0
babel-polyfill v6.7.4
babel-preset-react v6.5.0
babel-register v6.7.2
babel-runtime v6.6.1
这是我的路由文件的样子。
import {Route, IndexRoute} from '../node_modules/react-router';
import App from '../components/app';
import Dashboard from '../components/dashboard';
import UsersList from '../components/users/list';
import CoursesList from '../components/courses/list';
// Define routes
const routes = (
<Route path='/' component={App}>
<IndexRoute component={Dashboard}/>
<Route path='/dashboard' component={Dashboard} />
<Route path='/users' component={UsersList} />
<Route path='/courses' component={CoursesList} />
</Route>
);
export default routes;
这就是我的主要 js 的样子
import React from './node_modules/react';
import ReactDOM from './node_modules/react-dom';
import {Router, browserHistory} from './node_modules/react-router';
import routes from './configs/routes';
// Render
ReactDOM.render(<Router history={browserHistory} routes={routes} />, document.getElementById("app") );
请问这个错误是从哪里来的,我该如何解决?
你必须像
一样设置你的路由器
<Router history={browserHistory} >{routes}</Router>
而不是
<Router history={browserHistory} routes={routes} />
当我在浏览器上 运行 我的应用程序时,我在控制台中收到以下错误。
Warning: Failed propType: Invalid prop 'component' supplied to 'Route'.
我目前使用的是以下开发需求的版本
react v0.14.8
react-router v2.3.0
Webpack v1.13.0
babel-loader v6.2.4
babel-core v6.7.7
babel-preset-es2015 v6.6.0
babel-polyfill v6.7.4
babel-preset-react v6.5.0
babel-register v6.7.2
babel-runtime v6.6.1
这是我的路由文件的样子。
import {Route, IndexRoute} from '../node_modules/react-router';
import App from '../components/app';
import Dashboard from '../components/dashboard';
import UsersList from '../components/users/list';
import CoursesList from '../components/courses/list';
// Define routes
const routes = (
<Route path='/' component={App}>
<IndexRoute component={Dashboard}/>
<Route path='/dashboard' component={Dashboard} />
<Route path='/users' component={UsersList} />
<Route path='/courses' component={CoursesList} />
</Route>
);
export default routes;
这就是我的主要 js 的样子
import React from './node_modules/react';
import ReactDOM from './node_modules/react-dom';
import {Router, browserHistory} from './node_modules/react-router';
import routes from './configs/routes';
// Render
ReactDOM.render(<Router history={browserHistory} routes={routes} />, document.getElementById("app") );
请问这个错误是从哪里来的,我该如何解决?
你必须像
一样设置你的路由器<Router history={browserHistory} >{routes}</Router>
而不是
<Router history={browserHistory} routes={routes} />