一.?路由的跳轉?
1.?標簽跳轉
在需要跳轉的地方使用Link標簽?進行跳轉??
Link
注意:記得?引入? import {Link} from 'react-router-dom'
2.js?跳轉
在方法中使用以下代碼跳轉
js跳轉
二.路由的傳參
1.params
在router?文件中配置??<Route path="/four/:id" component={Four}/>
在跳轉時將地址寫為 '/four/7'
接收參數(shù)時使用??this.props.match.params.xxx(根據(jù)配置?此處是id)
url
結果?能拿到url中的值
2.query
在router文件中配置為正常配置? ?<Route path={'/five'} component={Five}/>
在跳轉時? 路徑為一個對象 pathname為路徑? query為一個對象? 寫參數(shù)
three.js
接收參數(shù)使用? ?this.props.location.query.xxx(根據(jù)填入對象的query? 此處是name)
five.js
注意? 只有跳轉的時候query才能有參數(shù)? ?直接輸入路徑?jīng)]有query?會報錯? ?所以可以在componentDidMount鉤子函數(shù)中取出參數(shù)賦值給state??
3.state??
使用方法和query幾乎相同? 將所有的query?改為state?就行了
在router文件中配置為正常配置? ?<Route path={'/five'} component={Five}/>
在跳轉時? 路徑為一個對象 pathname為路徑?state為一個對象? 寫參數(shù)
接收參數(shù)使用? ?this.props.location.state.xxx(根據(jù)填入對象的state? 此處是name)
