作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
假设我们有一个这样定义的类型:
type PropsBase<T> = {
optionalProp?: T;
}
type Props<T, TAdditionalProps extends object> = PropsBase<T> & TAdditionalProps
基本上我有一个公共(public)属性对象,然后子类可以在需要时添加更多属性。
type State<T> = {
value: T;
}
abstract class Base<T, TAdditional extends object = {}> {
state: State<T>;
constructor(props: Readonly<Props<T, TAdditional>>) {
this.state = {
value: props.optionalProp || this.fallbackValue() // ERROR!
}
}
abstract fallbackValue(): T;
}
这会导致以下错误:
TS2322: Type 'T | Props<T, TAdditional>["optionalProp"]' is not assignable to type 'T'.
'T' could be instantiated with an arbitrary type which could be unrelated to
'T | Props<T, TAdditional>["optionalProp"]'.
如果我制作
optionalProp
不是可选的(删除
?
)然后它可以工作,如果我删除它也可以工作
Readonly
来自构造函数,只需使用
Props<T, TAdditional>
反而。
Readonly
在这里并有一个可选的属性?
strict: true
在我的 tsconfig.json 中。我知道如果我将它设置为
false
它会工作的。
最佳答案
我认为从 || 切换到 ??解决您的问题。
Playground
type PropsBase<T> = {
optionalProp?: T;
}
type Props<T, TAdditionalProps extends object> = PropsBase<T> & TAdditionalProps
type State<T> = {
value: T;
}
abstract class Base<T, TAdditional extends object = {}> {
state: State<T>;
constructor(props: Readonly<Props<T, TAdditional>>) {
this.state = {
value: props.optionalProp ?? this.fallbackValue()
}
}
abstract fallbackValue(): T;
}
关于Typescript 假定属性类型为 T |属性 ["key"] 而不仅仅是 T,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/68440372/
我是一名优秀的程序员,十分优秀!