我先说小恩赐,先抱歉。
我搜索了一些类似的问题,但没有帮助。 无法弄清楚自己发生了什么,它几乎花了我1个小时。
我用最新的yeoman& amp;发电反应-的WebPack。
总是存在一些错误。在浏览器控制台中。
virtualenvwrapper
这里是Warning: Failed prop type: Invalid prop `children` supplied to`Router`.
Warning: [react-router] Location "/" did not match any routes
。
index.js
这里是import 'core-js/fn/object/assign';
import React from 'react';
import ReactDOM from 'react-dom';
import {Router, Route, hashHistory, IndexRoute} from 'react-router';
import IndexPage from './components/IndexPage';
import Pages from './components/Pages';
ReactDOM.render((
<Router history={hashHistory}>
<Route path="/" component={IndexPage} />
<Route path="/pages" component={Pages} />
</Router>
), document.getElementById('webapp'));
。
Indexpage.js
这里是import React, {Component} from 'react';
export default class IndexPage extends Component {
render() {
return (
<div>1234</div>
)
}
}
。
pages.js
答案 0 :(得分:0)
检查文件名和导入语句是否具有正确的拼写。
pages.js应为 P ages.js
Indexpage.js应为Index P age.js
或者在导入语句中更改它..区分大小写。
文档说你必须使用主路由器/
包裹你的路由 <Router history={browserHistory}>
<Route path="/" component={App}>
<Route path="about" component={About}/>
<Route path="users" component={Users}>
<Route path="/user/:userId" component={User}/>
</Route>
<Route path="*" component={NoMatch}/>
</Route>
</Router>
// this is the main App component
const App = ({children}) => (
<div id="main-layout">{children}</div>
)
答案 1 :(得分:0)
您的pages.js有一个错误的类名。您不想将其称为IndexPage,而是将其称为页面,如下所示。
import React, {Component} from 'react';
export default class Pages extends Component {
render() {
return (
<div>9876</div>
)
}
}