[英]TypeScript: How do I narrow / write a guard for a complex conditional type?
给定以下MultiselectValue
条件类型,如何根据multiple
的值或通过Comp
中的守卫将其解析为LabeledValue<T>
或Array<LabeledValue<T>>
?
export interface LabeledValue<T = unknown> {
label: string;
value: T;
}
export type MultiselectValue<T, Multiple> = Multiple extends (undefined | false)
? LabeledValue<T>
: Array<LabeledValue<T>>;
export type MultiselectProps<T, Multiple extends boolean | undefined> = {
multiple: Multiple;
value: MultiselectValue<T, Multiple>;
}
Comp({
multiple: true,
value: [{ // tsc complains if not an array (as expected) because 'multiple' is 'true'
label: 'Option 1',
value: 5
}]
});
function Comp<T, Multiple extends boolean | undefined = undefined>(props: MultiselectProps<T, Multiple>) {
const { multiple, value } = props;
if (multiple) {
// value is an arrray here
} else {
// value is a string here
}
}
最简单的方法是实际更改MultiselectProps
的定义:
type MultiselectProps<T, Multiple extends boolean | undefined> = Multiple extends (undefined | false) ? {
multiple: Multiple;
value: LabeledValue<T>;
} : {
multiple: Multiple;
value: Array<LabeledValue<T>>;
};
现在,在 function 主体中, props
是一个可区分的联合(未解析类型),这意味着您可以像以前那样缩小它。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.