Typescript如何从路径字符串中提取所有:前缀路由参数的联合类型

实现方案 #

你可以通过递归模板字面量类型逐段拆分路径，提取所有符合规则的参数名：

type PathParam<T extends string> =
  // 匹配到【冒号+参数名+斜杠+剩余路径】的场景
  T extends `${string}:${infer Param}/${infer Rest}`
    // 提取当前参数 + 递归提取剩余路径的参数，合并为联合类型
    ? Param | PathParam<Rest>
    // 匹配路径末尾最后一个参数的场景（后面没有斜杠）
    : T extends `${string}:${infer LastParam}`
      ? LastParam
      // 无匹配参数时返回空联合
      : never

效果验证 #

// 单参数场景
type ParamSingle = PathParam<"/post/:post_id">;
// 类型等价于："post_id"

// 多参数场景
type ParamMultiple = PathParam<"/post/:post_id/likes/:like_id">;
// 类型等价于："post_id" | "like_id"

逻辑说明 #

每次匹配到路径中的:后，先截取到下一个/之前的内容作为当前参数，再把剩余的路径片段传入类型递归处理，所有提取到的参数会自动合并为联合类型，完全等效于正则全局匹配的效果。
如果需要进一步限制参数名只能由小写字母和下划线组成，给Param增加额外的模式匹配判断即可。

内容的提问来源于stack exchange，提问作者Eliya Cohen