react-router-dom v6提供了哪些新的API能力？

已经没有以前的component了，均使用element

Outlet占位符，对标vue的<router-view/>

提供了很多API,例如：useNavigate、useLocation、useParams

import React from "react";
import {
  BrowserRouter,
  Link,
  useLocation,
  Route,
  Routes,
  useNavigate,
  useParams,
  Outlet,
} from "react-router-dom";

export default function NewRouter() {
  const News = () => {
    const { id } = useParams();
    const { pathname } = useLocation();

    return (
      <div>
        News {id},地址是{pathname}
      </div>
    );
  };
  const Uer = () => {
    const nav = useNavigate();

    return <div onClick={() => nav("/news/1")}>User</div>;
  };
  const Menu = () => (
    <div>
      <div>
        <Link to="/">首页</Link>
        <Link to="/news">新闻</Link>
        <Link to="/user">我的</Link>
      </div>
      <Outlet />
    </div>
  );
  return (
    <div>
      <BrowserRouter>
        <Routes>
          <Route path="/" element={<Menu />}>
            <Route index element={<div>首页</div>} />
            <Route path="user" element={<Uer />} />
            <Route path="news/:id" element={<News />} />
          </Route>
        </Routes>
      </BrowserRouter>
    </div>
  );
}