TypeScript如何定义XORType实现组件props仅传A或B其中一个

核心类型定义 #

先实现通用的双类型互斥工具，再组合你的props要求：

// 通用互斥工具类型：要求两个类型只能满足其中一个
type Exclusive<T, U> = (T & { [K in keyof U]?: never }) | (U & { [K in keyof T]?: never })

// 适配你的场景的XORType
type XORType = Exclusive<{ A: boolean }, { B: boolean }>

实现逻辑 #

• 把两种合法情况组合为联合类型：要么仅包含A属性、B属性被标记为不可传入的never类型，要么仅包含B属性、A属性被标记为不可传入的never类型
• 联合类型会强制匹配其中一种分支，自然就满足「必须且只能传一个」的要求：同时传两个会触发never类型校验报错，都不传则无法匹配任何分支报错

校验效果验证 #

合法用例 #

const props1: XORType = { A: true }
const props2: XORType = { B: true }

非法用例（均会触发TS类型报错） #

// 同时传入两个属性
const props3: XORType = { A: true, B: true }
// 未传入任何属性
const props4: XORType = {}

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