将jsx转换为React组件？

Question

假设我有一个名为“ MyComponent”的组件，我想将其存储在打字稿中类型为“ MyComponent”的变量中，但使用JSX元素对其进行初始化，例如：

let comp: MyComponent = <MyComponent somePropInit={3} />

上面的代码生成如下错误：

类型“元素”中缺少“属性” componentDidMount”

我正在使用的实际组件：

export class PlayCard extends React.Component<AllCardProps, {}> {
    addToDeck(){...}

我如何存储它（我尝试了很多不同的事情，包括使用typeof，Card.PlayCard，PlayCard等）：

import * as Card from './PlayCard'
...
let c: Card.PlayCard = <PlayCard Id={32} />

^如果我尝试以上操作，我会得到一个错误

类型'Component <...>'中缺少'属性'addToDeck'

如果删除addToDeck，错误将继续向下移动到下一个函数。 看起来任何存在的函数都会以某种方式抛出它吗？

我将如何完成？

Answer 1

React组件的生命周期方法是可选值。

以下是接口的示例：

interface ComponentLifecycle < P, S > {
    /**
     * Called immediately before mounting occurs, and before `Component#render`.
     * Avoid introducing any side-effects or subscriptions in this method.
     */
    componentWillMount ? () : void;
    /**
     * Called immediately after a compoment is mounted. Setting state here will trigger re-rendering.
     */
    componentDidMount ? () : void;

因此错误不在React / typescript中。 您可能使用了引起问题的界面。

参考：

• @ Types / React / index.d.ts ：请参考行号 355。