以下是TypeScript和React的代码,输出以下错误信息:
属性'value'在类型'EventTarget'上不存在。
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事件类型的重复,该问题中提供的解决方案在这种情况下无法正常工作,因此可能是不同的原因。
我的tsconfig.json文件如下:
{
"compilerOptions": {
"target": "es5",
"module": "commonjs",
"lib": ["esnext", "dom"],
"jsx": "react",
"sourceMap": true,
"outDir": "./dist/",
"strict": true,
"noImplicitAny": true,
"esModuleInterop": true
}
}
typescript@2.7.2
和@types/react@16.0.40
进行编译,当我在我的答案中进行修复时,它可以正常编译。也许你的环境有一些奇怪的东西。创建一个新目录,然后从头开始安装东西,然后确保你从那里编译它:./node_modules/.bin/tsc ...
,看看是否有变化。 - Nitzan Tomer/node_modules/.bin/tsc InputForm.tsx --jsx react
,出现了相同的问题。 - tomhughesEventTarget
不是你需要的,注意currentTarget
属性的类型为EventTarget & T
。在你的情况下,T
是HTMLFormElement
,它具有value
属性。 - Nitzan Tomer