如何断言 return 类型的 React.Component 实例？

Question

在 typescript 中，我有一个 React 组件，Cell，

class Cell extends Component<void, void> {
...
}

当我使用它时，即

<Cell />

我得到的 return 类型是 JSX.Element。

相反，我试图断言 return 值是 Cell 的一个实例，而不是 JSX.Element，我该怎么做呢？

它失败了

Type `Element` is not assignable to type `Cell`

Answer 1

I am trying to assert that the return value is an instance of Cell, not JSX.Element

使用React.ReactElement<Cell>。例如

const foo: React.ReactElement<Cell> = <Cell/>; // Okay
const bar: React.ReactElement<Cell> = <NotCell/>; // Error!