将 React 组件作为参数时，“类型缺少以下属性、上下文、setState”

Question

我的用例非常简单，我想要一个动态反应组件并将其保存在注册表中：

import { Component } from 'react';
import DummyComponent from './DummyComponent';

class Registry {
  TestComponent: Component = DummyComponent;
}

DummyComponent.tsx:

import { Component } from 'react';

export default class DummyComponent extends Component {
  constructor(props: any) {
    super(props);
    throw new Error('Cannot use this dummy component');
  }
}

这引发了 TypeScript 错误： ts(2740): Type 'typeof DummyComponent' is missing the following properties from type 'Component<{}, {}, any>': context, setState, forceUpdate, render, and 3 more.

我究竟做错了什么？我只想Registry.TestComponent成为一个 React 组件，它不必拥有所有这些属性，因为 React 组件不需要它们。

我做了一个StackBlitz 示例来显示错误。错误略有不同，但我认为这是同一个问题。

tsconfig.json

{
  "compilerOptions": {
    "target": "es2015",
    "jsx": "react",
    "esModuleInterop": true,
    "forceConsistentCasingInFileNames": true,
    "lib": ["esnext"],
    "noEmit": true,
    "noFallthroughCasesInSwitch": true,
    "noImplicitReturns": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "strict": true
  },
  "include": ["src/**/*"]
}

Answer 1

Componenttype 是组件类的实例，而DummyComponent本身是一个类。

它应该是：

class Registry {
  TestComponent: ComponentClass = DummyComponent;
}

如果TestComponent不限于类组件，它是：

class Registry {
  TestComponent: ComponentType = DummyComponent;
}