reactjs - 组件上缺少 TypeScript ReactDOM 属性 'type'

Question

出现以下错误:

Error   TS2345  Argument of type 'typeof SomeComponent' 
is not assignable to parameter of type 'ReactElement<{}>'.
Property 'type' is missing in type 'typeof SomeComponent'.

得到以下代码 typescript 代码:

import * as React from 'react';
import * as ReactDOM from 'react-dom';

interface IProps{}    
interface IState {}

class SomeComponent extends React.Component<IProps, IState> {
    render() {
        return <div />;
    }
}

var component = SomeComponent;
var root = document.getElementById("root");

ReactDOM.render(component , root);

我尝试了以下方法:

class SomeComponent extends React.Component<IProps, IState> {
    render() {
        return <div />;
    }

    get type() {
        return "test";
    }
}

Answer 1

应该是这样的:

interface IProps{}    
interface IState {}

class SomeComponent extends React.Component<IProps, IState> {
    render() {
        return <div />;
    }
}

ReactDOM.render(<SomeComponent /> , document.getElementById("root"));

您不将组件类传递给render 函数，您需要传递实例。

---

编辑

这个:

var component = SomeComponent;

将对类 SomeComponent 的引用分配给 component 变量，这意味着如果您这样做，那么您可以同时执行这两项操作，而且它们是相同的:

var componentInstance1 = <SomeComponent />
var componentInstance2 = <component />

如果您不想使用 jsx/tsx 表示法，那么在构建组件时您需要传递 props:

var component = new SomeComponent(props);