当前路由加载器函数的类型
从父路由文件路径到其加载器函数类型的映射
请注意,父路由文件路径是相对于 app/
目录的。
例如,如果此元函数用于 /sales/customers/$customerId
// app/root.tsx
const loader = () => ({ hello: "world" })
export type Loader = typeof loader
// app/routes/sales.tsx
const loader = () => ({ salesCount: 1074 })
export type Loader = typeof loader
// app/routes/sales/customers.tsx
const loader = () => ({ customerCount: 74 })
export type Loader = typeof loader
// app/routes/sales/customers/$customersId.tsx
import type { Loader as RootLoader } from "../../../root"
import type { Loader as SalesLoader } from "../../sales"
import type { Loader as CustomersLoader } from "../../sales/customers"
const loader = () => ({ name: "Customer name" })
const meta: MetaFunction<typeof loader, {
"root": RootLoader,
"routes/sales": SalesLoader,
"routes/sales/customers": CustomersLoader,
}> = ({ data, matches }) => {
const { name } = data
// ^? string
const { customerCount } = matches.find((match) => match.id === "routes/sales/customers").data
// ^? number
const { salesCount } = matches.find((match) => match.id === "routes/sales").data
// ^? number
const { hello } = matches.find((match) => match.id === "root").data
// ^? "world"
}
一个函数,返回一个数据对象数组,用于在路由中渲染元数据 HTML 标签。这些标签不会在路由层级结构中的后代路由上渲染。换句话说,它们只会渲染在导出它们的路由上。