介绍 import React 得到& # 39;反应,,
{},Link import 得到& # 39;react-router& # 39;,
,
class Home extends React.Component {,
呈现(),{才能,
,,,return (,
,,,,,& lt; div>,
,,,,,,,& lt; p> Home,
,,,,,,,& lt; Link =?list"在用list,
,,,),
,,},
},
,
export default 家庭 import React 得到& # 39;反应,,
{},hashHistory import 得到& # 39;react-router& # 39;,
,
class List extends React.Component {,
呈现(),{才能,
,,,const arr =, (1, 2, 3],
,,,return (,
,,,,,& lt; ul>,
,,,,,,,{arr.map((项目,,指数),=祝辞,{,
,,,,,,,,,return & lt; li 关键={指数},onClick={this.clickHandler.bind(,,)}祝辞js jump 用{项}& lt;/li>,
,,,,,,,})},
,,,,,& lt;/ul>,
,,,),
,,},
clickHandler才能(值),{,
,,,hashHistory.push(& # 39;/细节/& # 39;,+,值),
,,},
},
,
export default 列表 import React 得到& # 39;反应,,
,
class NotFound extends React.Component {,
呈现(),{才能,
,,,return (,
,,,,,& lt; p> 404年,NotFound,
,,,),
,,},
},
,
export default NotFound import React 得到& # 39;反应,,
,
class App extends React.Component {,
呈现(),{才能,
,,,return (,
,,,,,& lt; div> {this.props.children} & lt;/div>,
,,,),
,,},
},
,
export default 应用 import React 得到& # 39;反应,,
import {,路由器,路线,IndexRoute },得到& # 39;react-router& # 39;,
,
import App 得到& # 39;. ./集装箱/应用程序,,
import Home 得到& # 39;. ./集装箱/回家# 39;,
import List 得到& # 39;. ./集装箱/列表,,
import Detail 得到& # 39;. ./集装箱/细节,,
import NotFound 得到& # 39;. ./集装箱/notfound # 39;,
,
class RouteMap extends React.Component {,
updateHandle才能(),{,
,,,console.log(& # 39;每次路由器变化之后都会触发& # 39;),
,,},
呈现(),{才能,
,,,return (,
,,,,,,& lt; Router 历史={this.props.history}, onUpdate={this.updateHandle.bind()}祝辞,
,,,,,,,& lt; Route 路径=& # 39;/& # 39;,组件={应用}祝辞,
,,,,,,,,,& lt; IndexRoute 组件={回家}/祝辞,
,,,,,,,,,& lt; Route 路径=& # 39;列表# 39;,组件={列表}/祝辞,
,,,,,,,,,& lt; Route 路径=& # 39;细节/:id # 39;,组件={细节}/祝辞,
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
怎么在反应中对路由进行配置?相信很多没有经验的人对此束手无策,为此本文总结了问题出现的原因和解决方法,通过这篇文章希望你能解决这个问题。
import React 得到& # 39;反应,,
,
class Detail extends React.Component {,
呈现(),{才能,
,,,return (,
,,,,,& lt; p>细节,url参数:{this.props.params.id} & lt;/p>,
,,,),
,,},
},
export default 细节
:
列表:
404 yemian:
在容器下面有一个应用程序。jsx总入口文件:
路由器文件夹下的:
