TypeScript可辨识联合如何将action与当前__typename属性绑定

问题原因 #

你之前的写法直接使用T["action"]取到了联合类型T所有分支的action全集，没有和当前第一层的__typename做绑定，所以每个第一层属性都会要求包含所有可能的action值，才会触发类型报错。

正确实现 #

可以配合TS内置的Extract工具类型实现绑定逻辑，写法如下：

type MappedObj = {
  // 第一层遍历所有__typename取值作为key
  [TypeName in T["__typename"]]: {
    // 先从联合类型T中筛选出当前__typename对应的类型分支，再取该分支的action作为第二层key
    [Action in Extract<T, { __typename: TypeName }>["action"]]: string
  }
}

效果验证 #

这个类型完全匹配你给出的obj示例结构：

• 第一层只能出现T1/T2/T3三个key
• 每个第一层key对应的对象，第二层只能出现对应类型的action取值，值要求为string类型
• 少写对应action、多加其他类型的action都会触发TS类型提示

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