ReactRouter如何使⽤history跳转的实现
在react-router中组件⾥⾯的跳转可以⽤<Link>
但是在组件外⾯改如何跳转，需要⽤到react路由的history
replace⽅法和push⽅法使⽤形式⼀样，replace的作⽤是取代当前历史记录
go，此⽅法⽤来前进或者倒退，(-1);
react router路由传参goBack，此⽅法⽤来回退，Back();
goForward，此⽅法⽤来前进，Forward();
1.hook
import {useHistory} from 'react-router-dom';
function goPage(e) {
history.push({
pathname: "/home",
state: {id: 1}
});
}
pathname是路由地址，state可以传参
获取参数：
import {useLocation} from 'react-router-dom';
function getParams(){
let location = useLocation();
let id = location.state.id;
}
2.class组件
import React from 'react';
import {createBrowserHistory} from "history";
class App extends React.Component{
constructor(props) {
super(props);
}
goPage() {
let history = createBrowserHistory()
history.push({
pathname: "/home",
state: {id: 1}
});
<();
}
render() {return null;}
}
如果不调⽤则路由改变了，但是页⾯不会跳转。
到此这篇关于React Router 如何使⽤history跳转的实现的⽂章就介绍到这了，更多相关React Router history跳转内容请搜索以前的⽂章或继续浏览下⾯的相关⽂章希望⼤家以后多多⽀持！