如何将 React BluePrint 组件与 TypeScript 一起使用？

【问题标题】：How to use React BluePrint components with TypeScript?如何将 React BluePrint 组件与 TypeScript 一起使用？
【发布时间】：2019-07-31 04:42:42
【问题描述】：

我正在尝试将 React 和蓝图与 tsx 文件一起使用

import * as React from 'react';
import { Button } from "@blueprintjs/core"

class App extends React.Component {
    render() {
       return <Button intent="success" text="button content" />
    }
}

export default App;

该文件名为 App.tsx。它抛出错误：

JSX 元素类不支持属性，因为它没有“props”属性。ts(2607) （别名）类按钮导入按钮

这段代码有什么问题？

【问题讨论】：

为什么有人要对此投反对票。老实说，我不知道如何解决这个问题
你解决了吗？我现在遇到完全相同的错误
不，我无法解决它

标签： reactjs typescript blueprint

【解决方案1】：

你应该从App定义一个props和state（你可以简单地传递{}）

export class App extends React.Component<{}, {}> { }

使用<App />

或者你想定义你的props

export class App extends React.Component<{ name: string, age: number }, {}> { }

使用<App name="Join" age="22" />
请注意，这些是对象类型而不是值。用name, age告诉thar App就能收到道具了

【讨论】：

但这里我没有应用程序的道具，我正在尝试使用带有意图和文本按钮的蓝图按钮