useLoaderData hook

useLoaderData hook 返回元件樹中最近的 RouteMatch 的 loader 資料。

useLoaderData hook 接受一個 options 物件。

• 型別：string
• 最近父匹配項的路由 ID
• 可選，但為了獲得完整的型別安全建議提供。
• 如果 opts.strict 為 true，如果未提供此選項，TypeScript 將會發出警告。
• 如果 opts.strict 為 false，TypeScript 將會為返回的 loader 資料提供更寬鬆的型別。

• 型別：boolean
• 可選 - 預設值：true
• 如果為 false，則將忽略 opts.from 選項，並且型別將被放寬，以反映所有可能的 loader 資料的共享型別。

• Optional (可選)
• (loaderData: TLoaderData) => TSelected
• 如果提供了此函式，它將被呼叫並傳入 loader 資料，其返回值將由 useLoaderData 返回。此值還將用於確定 hook 是否使用淺層相等檢查來重新渲染其父元件。

• 型別：boolean
• Optional (可選)
• 配置是否為 select 返回的值啟用結構共享。
• 有關更多資訊，請參閱 渲染最佳化指南。

• 如果提供了 select 函式，則返回 select 函式的返回值。
• 如果沒有提供 select 函式，則返回 loader 資料，或者在 opts.strict 為 false 時返回放寬後的 loader 資料。

import { useLoaderData } from '@tanstack/react-router'

function Component() {
  const loaderData = useLoaderData({ from: '/posts/$postId' })
  //     ^? { postId: string, body: string, ... }
  // ...
}

import { useLoaderData } from '@tanstack/react-router'

function Component() {
  const loaderData = useLoaderData({ from: '/posts/$postId' })
  //     ^? { postId: string, body: string, ... }
  // ...
}