<Routes> 的 Hook 版本,它使用对象而不是组件。这些对象具有与组件 props 相同的属性。
<Routes>
useRoutes 的返回值要么是一个有效的 React 元素,你可以用它来渲染路由树,要么是 null 如果没有任何匹配。
useRoutes
null
import * as React from "react";import { useRoutes } from "react-router";function App() { let element = useRoutes([ { path: "/", element: <Dashboard />, children: [ { path: "messages", element: <DashboardMessages />, }, { path: "tasks", element: <DashboardTasks /> }, ], }, { path: "team", element: <AboutPage /> }, ]); return element;} Copy
import * as React from "react";import { useRoutes } from "react-router";function App() { let element = useRoutes([ { path: "/", element: <Dashboard />, children: [ { path: "messages", element: <DashboardMessages />, }, { path: "tasks", element: <DashboardTasks /> }, ], }, { path: "team", element: <AboutPage /> }, ]); return element;}
可选
<Routes>
的 Hook 版本,它使用对象而不是组件。这些对象具有与组件 props 相同的属性。useRoutes
的返回值要么是一个有效的 React 元素,你可以用它来渲染路由树,要么是null
如果没有任何匹配。