TypeScript条件类型访问联合类型属性报索引错误的原因与解决

TypeScript 对值层面的控制流收窄和类型层面的条件判断采用完全独立的两套逻辑，二者行为并不对等：

• 值层面编写fruit.kind === "apple"判断时，TS 会自动触发类型收窄（narrowing），把联合类型Fruit中不符合判断条件的{ kind: "apple" }成员排除，因此三元表达式假分支里的fruit类型会自动收窄为{ kind: "grape"; color: "green" | "black" }，可以安全访问color属性。
• 类型层面编写TFruit["kind"] extends "apple"判断时，TS 不会对TFruit本身做收窄：这个条件仅校验TFruit的kind属性是否是"apple"的子类型，不会自动从TFruit的联合成员中排除kind为"apple"的类型。
  核心问题在于，这里的条件判断是针对TFruit["kind"]而非裸泛型TFruit本身，不会触发条件类型的联合分发特性。如果传入的泛型是整个Fruit联合类型，TFruit["kind"]的计算结果是"apple" | "grape"，显然不满足extends "apple"，会走到假分支，但此时TFruit仍然包含没有color属性的{ kind: "apple" }成员，TS 抛出Type '"color"' cannot be used to index type 'TFruit'是正常的类型保护行为，并非误报。

利用条件类型的裸泛型分发特性，直接对泛型本身做结构判断，就可以让联合类型的每个成员单独走条件分支逻辑，同时在分支内自动完成类型收窄：

type Fruit = { kind: "apple" } | { kind: "grape"; color: "green" | "black" };
type FruitTaste<TFruit extends Fruit> = TFruit extends { kind: "apple" }
  ? "good"
  : TFruit extends { color: "green" }
  ? "good"
  : "bad";

// 类型校验
type TestApple = FruitTaste<{ kind: "apple" }>; // 推导类型为 "good"
type TestGreenGrape = FruitTaste<{ kind: "grape"; color: "green" }>; // 推导类型为 "good"
type TestBlackGrape = FruitTaste<{ kind: "grape"; color: "black" }>; // 推导类型为 "bad"
type TestAllFruit = FruitTaste<Fruit>; // 推导类型为 "good" | "bad"，符合联合分发预期

如果一定要保留先判断kind属性的写法，可以在假分支用内置Extract工具类型手动收窄类型后再访问color，但写法相对冗余：

type FruitTaste<TFruit extends Fruit> = TFruit["kind"] extends "apple"
  ? "good"
  : Extract<TFruit, { kind: "grape" }>["color"] extends "green"
  ? "good"
  : "bad";

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