React/Maszynopis: rozszerzenie komponentu o dodatkowe właściwości

Question

Próbuję użyć reakcji, aby odtworzyć moje składniki prądu (napisane czystym pismem maszynowym), ale nie mogę znaleźć sposobu na dodanie dodatkowych podpór do komponentu rozszerzającego drugi.

export interface DataTableProps { 
    columns:any[]; 
    data:any[]; 
} 

export class DataTable extends React.Component<DataTableProps, {}> { 
    render(){ 
     -- I can use this.props.columns and this.props.data -- 
    } 
} 

export class AnimalTable extends DataTable{ 
    render(){ 
     -- I would need to use a this.props.onClickFunction -- 
    } 
} 

Moim problemem jest to, że muszę dać AnimalTable kilka rekwizytów, które nie mają związku z DataTable. Jak mogę to zrobić ?

Answer 1

Musisz zrobić DataTable generic tak, że będziesz w stanie wykorzystać interfejs, który rozciąga DataTableProps:

export interface AnimalTableProps extends DataTableProps { 
    onClickFunction: Function; 
} 

export class DataTable<T extends DataTableProps> extends React.Component<T, {}> { } 

export class AnimalTable extends DataTable<AnimalTableProps> { 
    render() { 
     // this.props.onClickFunction should be available 
    } 
}