Question

我是React和Typescript的初学者。我在使用react组件时遇到问题https://www.npmjs.com/package/react-toggle-button（打字稿中）。

我通过Visual Studio生成了类型。

顺便说一句import ToggleButton from 'react-toggle-button';错误：/ ClientApp / types / react-toggle-button“'没有默认导出。

因此，我以这种方式导入：

import * as ToggleButton from 'react-toggle-button';


 <ToggleButton
                        value={this.state.influencer.billingVATPayer || false}
                        onChange={(e: any) => { console.log(e) }}
                    />

我的错误：（TS）JSX元素类型'index'不是JSX元素的构造函数。类型“索引”中缺少属性“上下文”。

可以用某种方式导入no-typescript模块吗？

我的打字稿版本：3.2.4 我的React版本：16.7.0

谢谢前进

Answer 1

有时，软件包的安装版本为“ @ types /”，而不是包含需要/想要导入的项目类型的普通软件包（例如preprocessing）。如果没有这种选择，您可以：

A）创建您自己的.d.ts文件，并为您尝试导入的包创建自己的类型，如https://www.npmjs.com/package/@types/react所述。

或者您可以

B）编辑tsconfig.json文件，并添加属性_process_numpy_inputs()并将其设置为class Block extends React.Component { state = []; handleClick = index => { this.setState(state => { const newState = [...state]; //keep state immutable !newState[index] && (newState[index] = 0) newState[index]++ return newState }); }; render() { return ( <div> {[1,2,3].map((value, index) => <button className="block" onClick={() => this.handleClick(index)}> <div className="counter">{this.state[index]}</div> </button>)} </div> ); } }，该属性允许将JS文件导入到Typescript文件中，而不会引起lint或编译器的抱怨。在大型代码库（甚至小型代码库）正在过渡到Typescript并且无法立即将所有文件/组件都转换为Typescript时，此功能特别有用。也要向@hazardous大声喊叫。

如何在TypeScript中使用无打字稿的React组件？

1 个答案: