Question

我有以下内容：

interface OwnProps {
  children: React.ReactElement<any>[];
}

export class ActionMenuRenderer extends React.Component<OwnProps> {
  render() {
    const { children } = this.props;
    const actions = React.Children.toArray(children) as React.ReactElement<any>[];

    return (
      ...
    );
  }
}

我这样称呼它：

<ActionMenuRenderer>
  <button type="button">View</button>
  <button type="button">Edit</button>
  <button type="button">Delete</button>
</ActionMenuRenderer>

我想要求ActionMenuRenderer的子代为<a>或<button>。我尝试进行以下更改，但在IDE中没有看到编译错误：

interface OwnProps {
  children: React.ReactElement<HTMLButtonElement | HTMLAnchorElement>[];
}

如何要求子组件的子类型为特定类型？

Answer 1

这在Typescript中（从3.2版本开始）目前是不可能的。 Typescript将生成所有React组件作为常规JSX.Element类型，不幸的是它将满足您可能尝试限制的任何特定子类型。

来源： https://github.com/Microsoft/TypeScript/issues/21699

要求子组件属于某种类型

1 个答案: