TypeScript类型错误：`/${string}`类型无法赋值给ExternalPathString类型

我之前在使用Expo Router的Link组件时也碰到过几乎一模一样的类型匹配问题，咱们来拆解一下原因和解决办法：

问题根源 #

Expo Router定义的ExternalPathString是一个受约束的窄类型，它要求路径必须符合预定义的格式（比如是路由中存在的字面量路径，或者符合特定规则的动态路径）。而你用模板字符串/${service.name.toLowerCase()}生成的内容，TypeScript会自动将它推断为宽泛的string类型——哪怕实际值的格式完全正确，类型系统也会判定它和ExternalPathString不兼容，这就是你哪怕加了String()转换还是报错的核心原因。

可行的解决方案 #

方案1：类型断言（快速临时解决）

如果你能100%确定生成的路径格式完全符合ExternalPathString的要求，可以直接用类型断言告诉TypeScript跳过检查：

<Link      
  href={{          
    pathname: `/${service.name.toLowerCase()}` as ExternalPathString,      
  }} 
>
  {/* 你的链接内容 */}
</Link>

⚠️ 注意：类型断言是绕过TypeScript的类型校验，一定要确保运行时路径是有效的，避免出现路由跳转错误。

方案2：类型安全的路径生成函数（更严谨）

想兼顾动态生成的灵活性和类型安全，可以写一个小函数，用satisfies和const断言来确保生成的路径符合类型要求：

// 定义路径生成函数
const getServicePath = (serviceName: string): ExternalPathString => {
  const path = `/${serviceName.toLowerCase()}` as const;
  // 用satisfies确保路径格式符合ExternalPathString约束
  return path satisfies ExternalPathString;
};

// 在Link组件中使用
<Link      
  href={{          
    pathname: getServicePath(service.name),      
  }} 
>
  {/* 你的链接内容 */}
</Link>

这个方法既保留了动态生成的能力，又能让TypeScript帮我们做类型校验，降低出错风险。

方案3：遵循Expo Router的参数化路由规范（推荐）

如果你的路由是动态结构（比如对应项目中app/[serviceName]/page.tsx这样的路由文件），Expo Router更推荐用params传递动态参数——这种方式完全不需要手动拼接路径，类型系统会自动适配：

<Link      
  href={{          
    pathname: '/[serviceName]',
    params: { serviceName: service.name.toLowerCase() }
  }} 
>
  {/* 你的链接内容 */}
</Link>

这是最符合Expo Router设计理念的做法，也从根源上避免了类型不匹配的问题。

备注：内容来源于stack exchange，提问作者Vijay Jangal