react-router-dom ^6.0.0 怎样动态跳转页面以及传递参数

前因:
react-router-dom ^6.0.0  移除了 useHistory 这个Hook, 以至于动态跳转页面变得困难。
幸好提供了 useNavigate 这个新的hook.

例子：

import { useNavigate } from 'react-router-dom';
// 在组件里面
const navigate = useNavigate();
// 通过navigate() 跳转页面，参数可以放在state里。
navigate('/your-route-path', { state: { object: object}});

// 下个页面获取state.
import { useLocation } from 'react-router-dom';
let location = useLocation();
const { object } = location.state;

这样就可以实现页面带参数的动态的跳转。