useRouteLoaderData
useRouteLoaderData()
Hook 用来在当前已经渲染的组件中获取组件树中任何组件的loader
方法获取到的数据,不过通常都用来获取其祖辈层级的数据。这个 Hook 接受一个参数,用于指定要获取的loader
方法数据所在的组件的id
。
例如可以像以下示例中使用。
const router = createBrowserRouter([
{
path: "/",
loader: () => fetchData(),
element: <Root />,
id: "root",
children: [
{
path: "task/:tid",
loader: loadTask,
element: <TaskDetail />,
},
],
},
]);
function TaskDetail() {
const tasks = useRouteLoaderData("root");
// 其他业务代码
}