Reactjs 从react-typescript接口中删除重复项
我有以下接口:Reactjs 从react-typescript接口中删除重复项,reactjs,typescript,Reactjs,Typescript,我有以下接口: export interface AsyncRouteComponent<Props> extends React.Component<Props, AsyncRouteComponentState> { getInitialProps: ({ assets, data, renderPage }: DocumentProps) => any; load: () => Promise<React.ReactNode>; }
export interface AsyncRouteComponent<Props> extends React.Component<Props, AsyncRouteComponentState> {
getInitialProps: ({ assets, data, renderPage }: DocumentProps) => any;
load: () => Promise<React.ReactNode>;
}
export interface AsyncRouteComponentClass<Props> extends AsyncRouteComponent<Props> {
new (props: Props): AsyncRouteComponent<Props>;
getInitialProps: ({ assets, data, renderPage }: DocumentProps) => any;
load: () => Promise<React.ReactNode>;
}
export interface AsyncRouteStateless<Props> extends AsyncRouteComponent<Props> {
(props: Props): AsyncRouteComponent<Props>;
getInitialProps: ({ assets, data, renderPage }: DocumentProps) => any;
load: () => Promise<React.ReactNode>;
}
interface Common {
getInitialProps: ({ assets, data, renderPage }: DocumentProps) => any;
load: () => Promise<React.ReactNode>;
}
export interface AsyncRouteComponent<Props> extends Common, React.Component<Props, AsyncRouteComponentState> { }
export interface AsyncRouteComponentClass<Props> extends Common, AsyncRouteComponent<Props> {
new (props: Props): AsyncRouteComponent<Props>;
}
export interface AsyncRouteStateless<Props> extends Common, AsyncRouteComponent<Props> {
(props: Props): AsyncRouteComponent<Props>;
}
它们都有getInitialProps和load,但在扩展内容上有所不同
如何减少这些接口中的重复?只需将常用方法移动到一个单独的接口,该接口由您的所有接口扩展:
export interface AsyncRouteComponent<Props> extends React.Component<Props, AsyncRouteComponentState> {
getInitialProps: ({ assets, data, renderPage }: DocumentProps) => any;
load: () => Promise<React.ReactNode>;
}
export interface AsyncRouteComponentClass<Props> extends AsyncRouteComponent<Props> {
new (props: Props): AsyncRouteComponent<Props>;
getInitialProps: ({ assets, data, renderPage }: DocumentProps) => any;
load: () => Promise<React.ReactNode>;
}
export interface AsyncRouteStateless<Props> extends AsyncRouteComponent<Props> {
(props: Props): AsyncRouteComponent<Props>;
getInitialProps: ({ assets, data, renderPage }: DocumentProps) => any;
load: () => Promise<React.ReactNode>;
}
interface Common {
getInitialProps: ({ assets, data, renderPage }: DocumentProps) => any;
load: () => Promise<React.ReactNode>;
}
export interface AsyncRouteComponent<Props> extends Common, React.Component<Props, AsyncRouteComponentState> { }
export interface AsyncRouteComponentClass<Props> extends Common, AsyncRouteComponent<Props> {
new (props: Props): AsyncRouteComponent<Props>;
}
export interface AsyncRouteStateless<Props> extends Common, AsyncRouteComponent<Props> {
(props: Props): AsyncRouteComponent<Props>;
}