Typescript React 组件装饰器答案

【问题标题】：Typescript React component decoratorTypescript React 组件装饰器
【发布时间】：2018-04-06 21:44:09
【问题描述】：

这可能是一个新手错误，但我正在尝试使用 typescript 为 React 组件创建一个简单的类装饰器，如下所示：

import * as React from 'react'

interface Greeter {
  sayHello: boolean
}

const greet = (arg: Greeter) => (Comp: React.Component) => {
  // do some stuff
}

@greet({ sayHello: true })
class MyComp extends React.Component<any, any> {
  render() {
    return <div>Hi</div>
  }
}

但是我得到一个编译错误说

“typeof MyComp”类型的参数不能分配给输入“组件”。

我到底做错了什么？我是否缺少装饰器语法的内容？

【问题讨论】：

标签： typescript decorator

【解决方案1】：

我不确定这是何时添加的，但在较新版本的 @types/react 中，您也可以使用 React.ComponentType，例如

const greet = (arg: Greeter) => (Comp: React.ComponentType) => {
  // do some stuff
}

【讨论】：

【解决方案2】：

当您将类传递给greet，而不是该类的对象时，添加一个typeof：

const greet = (arg: Greeter) => (Comp: typeof React.Component) => {
  // do some stuff
}

【讨论】：