Vue中输入事件的类型是什么答案

【问题标题】：What are types for input events in VueVue中输入事件的类型是什么
【发布时间】：2020-08-28 09:27:56
【问题描述】：

什么是 Vue 中输入事件的正确 Typescript 类型？当我使用Event 时，它缺少目标值或键或文件属性。

让我们举个例子：

<input @input="(e: MISSING_TYPE) => {}" />
<input @keypress="(e: MISSING_TYPE) => {}" />

在 React 中，我们有类似 ChangeEvent 的东西，它是通用的并应用元素特定的类型。我们如何在 Vue 中做到这一点？

【问题讨论】：

KeyboardEvent 是您要找的吗？（事件 > UIEvent > 键盘事件）
谢谢，KeyboardEvent 看起来很适合按键操作。 input 和 e.target.value 呢？我们能否在这些特定事件的列表中提供任何文档，例如 KeyboardEvent，或者我们需要从代码库中提取它？
target 属于 Event 类型。我认为您需要转换为更具体的内容才能获得价值，即 (e.target).value
对于文档，你有KeyboardEvent，TypeScript 类型应该对应于此。您可以在lib.dom.d.ts 中亲自检查它们

【解决方案1】：

感谢cmets中@steve16351的回答，有总结：

对于像 keypress 这样的键盘事件，您可以使用 Event -> UIEvent -> KeyboardEvent 中更具体的事件：

<input @keypress="handleKeypress" />

handleKeypress(e: KeyboardEvent) { }

对于更具体的事件，如 HTMLInputElement 上的输入更改，您需要对其进行转换：

<input @input="handleInput" />

handleInput(e: Event) { 
  const target = (<HTMLInputElement>e.target)

  console.log(target.value)
}

【讨论】：