TypeScript泛型条件类型无法按字段值推导属性类型如何解决？

你当前写法的核心问题是：使用myType时未传入具体泛型参数，默认使用了AllContentType联合类型，条件类型会返回所有分支的联合结果string | number，TS不会根据你赋值的otherHeader字段反向推导泛型的具体值，因此无法正确缩窄body的类型。

方法1：显式指定泛型参数 #

直接将你使用的otherHeader具体值作为泛型传入即可：

const obj: myType<'multipart/form-data'> = { 
  otherHeader: 'multipart/form-data', 
  body: 123 // 此时body类型为number，传入字符串会触发类型错误
};

方法2：封装工厂函数自动推导泛型 #

如果不想每次手动声明泛型，可以封装简单的工厂函数，让TS根据传入的参数自动推导泛型类型：

function createMyType<T extends AllContentType>(val: myType<T>) {
  return val;
}

// 无需手动指定泛型，TS自动根据otherHeader的值推导T类型
const obj = createMyType({ 
  otherHeader: 'multipart/form-data', 
  body: 123 // body自动识别为number
});

const obj2 = createMyType({
  otherHeader: 'application/json',
  body: '{}' // body自动识别为string
});

方法3：改写为可辨识联合类型（无泛型方案） #

如果不想使用泛型，也可以直接将myType定义为可辨识联合类型，TS会根据otherHeader的取值自动缩窄body的类型：

type MyType =
  | {
      otherHeader: 'multipart/form-data';
      body: number;
    }
  | {
      otherHeader: Exclude<AllContentType, 'multipart/form-data'>;
      body: string;
    };

const obj: MyType = {
  otherHeader: 'multipart/form-data',
  body: 123 // 自动推导body为number
};

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