我有组件 Checkbox.tsx
,其 ts 界面如下所示:
export interface ICheckbox {
/** DOM element id. */
id: string;
/** Handler to the onClick event */
onCheck?: (e: React.ChangeEvent<HTMLInputElement>) => void;
}
现在,我想创建另一个组件 CheckboxWithLabel.tsx
,它将具有非常相似的界面,唯一的附加内容是标签。如何合并两个接口(interface)或扩展现有接口(interface)?像这样的东西:
import {ICheckbox} from './Checkbox.tsx';
export interface ICheckboxLabel {
...ICheckbox,
label: string;
}
我尝试过的是:
export interface ICheckboxLabel extends ICheckbox{
children: JSX.Element | JSX.Element[] | string;
}
问题是,我不知道这是否是正确的方法。
最佳答案
您可以使用extends关键字导出接口(interface)。
interface a extends b {
...
}
在您的示例中,它会像这样。
export interface ICheckboxLabel extends ICheckbox {
label: string
}
另请访问官方文档以获取更多信息 https://www.typescriptlang.org/docs/handbook/interfaces.html
关于javascript - 扩展 typescript 接口(interface),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53593386/