时间戳

首页 > 解决方案 > Vue中输入事件的类型是什么

typescript - Vue中输入事件的类型是什么

问题描述

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

让我们举个例子：

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

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

标签： typescriptvue.jsnuxtjs

解决方案

感谢评论中的@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)
}

推荐阅读