[英]ReactJs / Typescript: How to extend state interface
I have the following:我有以下内容:
interface EditViewState<T> {
entity?: T;
}
abstract class EditView<T, P, S> extends React.Component<P, EditViewState<T> & S> {
constructor(props: P, ctx: any) {
super(props, ctx);
this.state = {
mode: "loading" // Type '{ entity: null; }' is not assignable to type 'Readonly<EditViewState<T> & S>'.ts(2322
}
}
componentDidMount() {
this.setState({ mode: "show" }) // Type '"show"' is not assignable to type '("loading" & S["mode"]) | ("show" & S["mode"]) | ("edit" & S["mode"])'.ts(2345)
}
}
How can I use the EditViewState
and extend it with S
which is coming from the concrete class?如何使用EditViewState
并使用来自具体 class 的S
扩展它?
For now I have a workaround by using Exclude
现在我有一个使用Exclude
的解决方法
abstract class EditView<T, P, S> extends React.Component<P, Exclude<EditViewState<T> & S, keyof S>> {
constructor(props: P, ctx: any) {
super(props, ctx);
//@ts-ignore https://github.com/microsoft/TypeScript/issues/38947
this.state = {
mode: "loading"
}
}
componentDidMount() {
this.setState({ mode: "show" })
}
}
With that everything works perfect.有了这个,一切都完美无缺。 The concrecte class now has the auto completion for the states of EditViewState
and it's own states S
.具体的 class 现在可以自动完成EditViewState
的状态和它自己的状态S
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.