tx2604: JSX 元素类型“A”不具有任何构造签名或调用签名

Question

如图，想要实现懒加载，却报错了。
有人遇到过这种问题吗？

Answer 1

我的理解是：A必须是个类，或函数, 返回JSX Element，因为jsx需要是个JSX Element。

Answer 2

刚好遇到...，挖一下坟

import React from 'react';

export interface IDemoProps {}
export interface IDemoState {
    A?: keyof JSX.IntrinsicElements | any;
}

class Demo extends React.PureComponent<IDemoProps, IDemoState> {
    public state: IDemoState = {};
    constructor(props:IDemoProps) {
       super(props);
       this.state = {
           A: null
       }
    }
    render() {
        const { A } = this.state;
        return (
            <div>
                {A ? <A /> : null}
            </div>
        )
    }
}

Answer 3

如果你跟我一样，正在迁移旧项目，.tsx 中需要引用 .js 组件，可以临时这样处理：

import Button from '../components/Button';

const ButtonX: React.FC<any> = Button as any;

const Demo = () => {
    return <ButtonX />
}

Answer 4

这样

import A from './a'

// ...
state: { ComponentA: typeof A | null } = { a: null }
// ...