类型 'xxx' 缺少类型"ElementClass"中的以下属性：上下文、setState、forceUpdate、props 等 2 个属性。TS2605

Question

我在尝试运行我的反应应用程序时收到以下错误：

D：/React/my-components/src/App.tsx D：/React/my-components/src/App.tsx(23,4( 中的 TypeScript 错误： JSX 元素类型"确认"不是 JSX 元素的构造函数。 类型"确认"缺少类型"ElementClass"中的以下属性：context，setState，forceUpdate，props等2个属性。 TS2605

21 |         </a>
22 |       </header>
23 |      <Confirm />
|      ^
24 |     </div>
25 |   );
26 | }

这是我的确认组件代码

import * as React from "react";
class Confirm extends React.Component{
	 render(){
					return (
						<div className="confirm-wrapper confirm-visible">
			<div className="confirm-container">
			<div className="confirm-title-container">
			<span>This is where our title should go</span>
			</div>
			<div className="confirm-content-container">
			<p>This is where our content should go</p>
			</div>
			<div className="confirm-buttons-container">
			<button className="confirm-cancel">Cancel</button>
			<button className="confirm-ok">Okay</button>
			</div>
			</div>
			</div>
					);
	}
	
}
export default Confirm;

和应用程序代码

import React from 'react';
import logo from './logo.svg';
import './App.css';
import Confirm from './Confirm';
const App: React.FC = () => {
return (
<div className="App">
<header className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<p>
Edit <code>src/App.tsx</code> and save to reload.
</p>
<a
className="App-link"
href="https://reactjs.org"
target="_blank"
rel="noopener noreferrer"
>
Learn React
</a>
</header>
	  <Confirm />
</div>
);
}
export default App;

这是我的包.json

{
"name": "my-components",
"version": "0.1.0",
"private": true,
"dependencies": {
"@types/jest": "24.0.18",
"@types/node": "12.7.8",
"@types/react": "16.9.4",
"@types/react-dom": "16.9.1",
"react-scripts": "3.1.2",
"typescript": "3.6.3"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"react": "^16.10.1",
"react-dom": "^16.10.1",
"tslint": "^5.20.0",
"tslint-config-prettier": "^1.18.0",
"tslint-react": "^4.1.0"
}
}

Answer 1

谢谢大家，我已经通过运行以下命令修复了此错误

纱线升级@types/react@latest

Answer 2

我有一个名为Component.tsx(驼峰(的组件和一个名为component.ts(小写(的助手，这似乎使它们变得混乱。我也将它们导入到同一个文件中，所以我只是重命名了组件。