使用 Preact + Typescript 的类型安全事件处理程序
Typesafe event handlers with Preact + Typescript
我正在使用 Preact 编写一个简单的组件,它使用 onChange
处理程序来处理 <input/>
元素:
function Example(props: {}) {
return <input onChange={(e) => {
const { value } = e.currentTarget;
console.log(value);
}} />
}
上面的代码会产生以下错误:
Property 'value' does not exist on type 'EventTarget'.ts(2339)
最快的解决方法是进行类型转换:
const el = (e.currentTarget as HTMLInputElement).value;
但我不想为这种常见操作向应用程序添加类型转换。
在不使用类型转换或 any
类型的情况下 编写表单事件处理程序的正确方法是什么?
环境信息:
"strict": true
在 tsconfig.json
preact@8.5.2
- 没有安装外部类型。使用包默认值。
免责声明:我在 Preact 上工作。
这是我们当前的 Preact 类型中的一个错误。这些与 preact
npm 包本身一起分发。这是我们的跟踪器中与此相关的问题:https://github.com/preactjs/preact/issues/1930
我正在使用 Preact 编写一个简单的组件,它使用 onChange
处理程序来处理 <input/>
元素:
function Example(props: {}) {
return <input onChange={(e) => {
const { value } = e.currentTarget;
console.log(value);
}} />
}
上面的代码会产生以下错误:
Property 'value' does not exist on type 'EventTarget'.ts(2339)
最快的解决方法是进行类型转换:
const el = (e.currentTarget as HTMLInputElement).value;
但我不想为这种常见操作向应用程序添加类型转换。
在不使用类型转换或 any
类型的情况下 编写表单事件处理程序的正确方法是什么?
环境信息:
"strict": true
在 tsconfig.jsonpreact@8.5.2
- 没有安装外部类型。使用包默认值。
免责声明:我在 Preact 上工作。
这是我们当前的 Preact 类型中的一个错误。这些与 preact
npm 包本身一起分发。这是我们的跟踪器中与此相关的问题:https://github.com/preactjs/preact/issues/1930