react 获取当前路由

在 React 中，可以通过 `useLocation` 和 `useHistory` 钩子来获取当前路由信息。

使用 `useLocation` 钩子可以获取当前路径和查询参数等信息。例如：

import { useLocation } from 'react-router-dom';

function MyComponent() {
  const location = useLocation();
  const { pathname, search } = location;
  console.log(pathname); // 当前路径
  console.log(search); // 查询参数
  return (
    // ...
  );
}

使用 `useHistory` 钩子可以获取路由的历史记录，可以用来进行前进、后退等操作。例如：

import { useHistory } from 'react-router-dom';

function MyComponent() {
  const history = useHistory();
  function handleClick() {
    history.push('/other-page'); // 跳转到另外一个页面
  }
  return (
    <button onClick={handleClick}>跳转到其他页面</button>
  );
}

需要注意的是，在使用这些钩子之前，需要先使用 `BrowserRouter` 或 `HashRouter` 等路由组件进行包裹。例如：

import { BrowserRouter as Router, Route } from 'react-router-dom';

function App() {
  return (
    <Router>
      <Route path="/" component={MyComponent} />
    </Router>
  );
}