十八、路由模块不只有 loader/action/component

1 分钟 224 字第 581 / 962 个阅读单元

一个完整路由模块，通常还能导出这些：

meta：标题、描述、SEO 信息
links：样式表、预加载资源
headers：响应头控制
ErrorBoundary：本路由错误边界
handle：挂一些路由元数据供父层读取
shouldRevalidate：细粒度控制何时重验证

例如：

tsx

import type { MetaFunction } from "@remix-run/node";

export const meta: MetaFunction<typeof loader> = ({ data }) => {
  if (!data?.ship) {
    return [{ title: "船舶不存在" }];
  }

  return [
    { title: `${data.ship.name} | 航运港` },
    { name: "description", content: `查看 ${data.ship.name} 的泊位信息` },
  ];
};

这件事的意义在于：

一个路由文件，不只负责屏幕里那块 JSX，而是负责这个泊位的“完整文档表现”。

这也是 Remix 和很多“只在客户端思考”的做法很不同的地方。