笔记二十八:在函数组件Hooks中跳转路由

313 阅读1分钟

本文已参与「新人创作礼」活动,一起开启掘金创作之路。

本文已参与「新人创作礼」活动,一起开启掘金创作之路。

使用 withRouter:

import {Router,witRouter} from 'react-router-dom

function app(props){
    const handleGoTo=()=>{
        props.history.push('/home')
    }
    return (
        <div>
            <button onClick={handleGoTo}>跳转</button>
            <router path='/home' component={Home}>
        </div>
    )
}

使用 useHistory:

import { Route, useHistory } from "react-router-dom";
function App() {
	const history = useHistory()
	const handleGoTo = () => {
	  history.push('/home')
    }
	  
	return (
	  <div>
	    <button onClick={handleGoTo}>跳转</button>
	    <Route path='/home' component={Home} />
	  </div>  );
 }
	
export default App;