[英]TS2339: Property does not exist on union type - property string | undefined
I have problem with my union type, which looks like this: 我的联合体类型出现问题,如下所示:
type RepeatForm = {
step:
| {
repeat: false;
}
| {
repeat: true;
from: undefined;
}
| {
repeat: true;
from: string;
by?: string;
};
};
And I have following function where I want to get value of by
if it's there: 我有如下的功能,我想获得的价值by
,如果它的存在:
export const getByField = (form: RepeatForm) => {
if (form.step.repeat === false || form.step.from === undefined) {
return null;
}
const x = form.step.from;
return form.step.by;
};
I get this error: Property 'by' does not exist on type '{ repeat: true; from: undefined; } | { repeat: true; from: string; by?: string | undefined; }'. Property 'by' does not exist on type '{ repeat: true; from: undefined; }'.
我收到此错误: Property 'by' does not exist on type '{ repeat: true; from: undefined; } | { repeat: true; from: string; by?: string | undefined; }'. Property 'by' does not exist on type '{ repeat: true; from: undefined; }'.
Property 'by' does not exist on type '{ repeat: true; from: undefined; } | { repeat: true; from: string; by?: string | undefined; }'. Property 'by' does not exist on type '{ repeat: true; from: undefined; }'.
Which is super confusing for me, because TypeScript know that form.step.from
is different from undefined
and he even interpolates type of variable x
to string
. 这让我感到非常困惑,因为TypeScript知道form.step.from
与undefined
不同,他甚至将变量x
类型插值到string
。
What's the reason of this issue? 这个问题的原因是什么? How can I access by
property then? 那我该如何by
财产访问?
The original PR for discriminated unions is very specific about the fact that the discriminating field must be a string
literal type (with the option to add support for boolean
and number
literal types which seems to have happened). 区分联合的原始PR非常明确地说明了区分字段必须是string
文字类型的事实(可以选择添加对似乎已经发生的boolean
和number
文字类型的支持)。 So your use case where you are discriminating based on the type of the field ( string
vs undefined
) does not appear to be supported. 因此,似乎不支持您根据字段类型( string
与undefined
)进行区分的用例。 This does not work for example: 例如,这不起作用:
let u!: { v: number, n: number } | { v: string, s: string}
if(typeof u.v === 'number') {
u.n // not accesible, type not narrowed
}
We could use conditional types and a custom type guard to make things work: 我们可以使用条件类型和自定义类型防护来使事情正常运行:
function isUndefined<T, K extends keyof T>(value : T, field: K) : value is Extract<T, { [P in K] : undefined }> {
return !!value[field]
}
export const getByField = (form: RepeatForm) => {
if (form.step.repeat === false || isUndefined(form.step, 'from')) {
return null;
}
const x = form.step.from;
return form.step.by;
};
We can also create a general version of this function that allows narrowing by any type: 我们还可以创建此函数的常规版本,该版本允许按任何类型进行缩小:
type ExtractKeysOfType<T, TValue> = { [P in keyof T]: T[P] extends TValue ? P : never}[keyof T]
function fieldOfType<T, K extends ExtractKeysOfType<T, string>>(value : T, field: K, type: 'string'): value is Extract<T, { [P in K] : string }>
function fieldOfType<T, K extends ExtractKeysOfType<T, number>>(value : T, field: K, type: 'number'): value is Extract<T, { [P in K] : number }>
function fieldOfType<T, K extends ExtractKeysOfType<T, boolean>>(value : T, field: K, type: 'boolean'): value is Extract<T, { [P in K] : boolean }>
function fieldOfType<T, K extends ExtractKeysOfType<T, Function>>(value : T, field: K, type: 'function'): value is Extract<T, { [P in K] : Function }>
function fieldOfType<T, K extends ExtractKeysOfType<T, symbol>>(value : T, field: K, type: 'symbol'): value is Extract<T, { [P in K] : symbol }>
function fieldOfType<T, K extends ExtractKeysOfType<T, object>>(value : T, field: K, type: 'object'): value is Extract<T, { [P in K] : object }>
function fieldOfType<T, K extends ExtractKeysOfType<T, undefined>>(value : T, field: K, type: 'undefined'): value is Extract<T, { [P in K] : undefined }>
function fieldOfType<T, K extends keyof T, TValue extends T[K]>(value : T, field: K, type: new (...args:any[])=> TValue): value is Extract<T, { [P in K] : TValue }>
function fieldOfType<T, K extends keyof T>(value : T, field: K, type: string| Function) :boolean {
if(typeof type === 'string') {
return typeof value[field] === type;
} else {
return value[field] instanceof type
}
}
const getByField = (form: RepeatForm) => {
if (form.step.repeat === false || fieldOfType(form.step, 'from', 'undefined')) {
return null;
}
const x = form.step.from;
return form.step.by;
};
let u: { v: number, n: number } | { v: string, s: string}={ v: 0, n : 10};
if(fieldOfType(u, 'v', 'number')) {
console.log(u.n);
}
class A {private a: undefined;}
class B {private b: undefined;}
let uc: { v: A, n: number } | { v: B, s: string} = Math.random() > 0.5 ? { v: new B(), s: '10' } : { v: new A(), n: 10 };
if(fieldOfType(uc, 'v', A)) {
console.log(uc.n)
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.