带有 React 的 TypeScript 中的以下代码输出以下错误。
类型“EventTarget”上不存在属性“value”。
import React, { Component } from 'react';
class InputForm extends React.Component<any ,any> {
state = {
userInput: ''
};
handleUserInput = (e: React.FormEvent<HTMLInputElement>): void => {
this.setState({
userInput: e.target.value
});
}
// Working code from 42081549
// Not relevant to this project
update = (e: React.FormEvent<HTMLInputElement>): void => {
this.props.login[e.currentTarget.name] = e.currentTarget.value
}
submitMessage = (e: React.FormEvent<HTMLFormElement>): void => {
e.preventDefault();
this.props.sendUserMessage(this.state.userInput)
}
render() {
return (
<form className="chat-input-form" onSubmit={this.submitMessage}>
<input value={this.state.userInput} onChange={this.handleUserInput}/>
<button type="submit" />
</form>
);
}
}
export default InputForm;
我目前正在使用:
"@types/react": "^16.0.40",
“react”:“^ 16.2.0”,
"typescript": "^2.7.2",
这可以被认为是Typescript: React event types的后续,但是它不是重复的,因为Nitzan Tomer在这个答案中提供的工作代码目前在我的特定用例中不起作用。
编辑如上所述,不是Typescript: React event types的副本,该问题中提供的解决方案在这种情况下不起作用,因此可能是不同的原因。
我的 tsconfig.json 文件如下:
{
"compilerOptions": {
"target": "es5",
"module": "commonjs",
"lib": ["esnext", "dom"],
"jsx": "react",
"sourceMap": true,
"outDir": "./dist/",
"strict": true,
"noImplicitAny": true,
"esModuleInterop": true
}
}