Router 的问题:浏览器中报 Cannot GET ***
来源:10-1 Router概念
yxnne
2017-12-18
//root.js====================================================================
//引入
import {
BrowserRouter ,
Route,
Link,
Switch
} from 'react-router-dom';
import Index from './index';
import ComponentBodyIndex from './component/body';
class Root extends React.Component{
render(){
return (
<BrowserRouter>
<Switch>
<Route path="/" component={Index}/>
<Route exact path="/test" component={ComponentBodyIndex}/>
</Switch>
</BrowserRouter>
)
}
}
//入口
ReactDOM.render(<Root/>,document.getElementById('example'));
// webpack.config.js===================================================================
const webpack = require('webpack');
const path = require('path');
module.exports = {
context : __dirname + '/src',
entry : "./js/root.js",
module : {
loaders :[{
test : /.js?$/,
exclude:/(node_modules)/,
loader: 'babel-loader',
query :{
presets:['react' , 'babel-preset-react']
}
}]
},
output:{
path:__dirname + "/src/",
filename:"bundle.js"
},
devServer:{
//我们在这里对webpack-dev-server进行配置
port:18080
}
};
//package.json=======================================================
{
"name": "react_integreate",
"version": "1.0.0",
"description": "",
"main": "root.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "yxnne",
"license": "ISC",
"dependencies": {
"babel-loader": "^7.1.2",
"babel-preset-es2015": "^6.24.1",
"react": "^16.2.0",
"react-dom": "^16.2.0",
"react-mini-router": "^2.2.1",
"react-router-dom": "^4.2.2",
"webpack": "^3.10.0",
"webpack-dev-server": "^2.9.7"
},
"devDependencies": {
"babel-cli": "^6.26.0",
"babel-preset-env": "^1.6.1",
"babel-preset-react": "^6.24.1"
}
}学习到router这一节,也知道老师这里是基于react router 2 的 。我在使用react router 4 的时候 js所写上所示,但是服务开启之后,在浏览器中输入:http://localhost:18080/ (我的端口是18080) 是可以访问的,但是输入http://localhost:18080/test 的时候不是我想要的组件,而是“Cannot GET /test”,控制台和终端都没有报错。请问老师我是哪里出问题了?
写回答
1回答
-
第二十章我又讲解了 react router 4 的用法并且有源码。
132017-12-19
相似问题