• 首页 首页 icon
  • 工具库 工具库 icon
    • IP查询 IP查询 icon
  • 内容库 内容库 icon
    • 快讯库 快讯库 icon
    • 精品库 精品库 icon
    • 问答库 问答库 icon
  • 更多 更多 icon
    • 服务条款 服务条款 icon

vue ts click的事件类型怎么写

武飞扬头像
一个网络搬砖的斜杠青年
帮助1

vue ts click中的事件类型怎么写?

为事件处理器添加类型

在处理原生 DOM 事件的时候,正确地为处理函数的参数添加类型或许会是有用的。让我们看这个例子:

<template>
  <input type="text" @change="handleChange" />
</template>
<script lang="ts">
import { defineComponent } from 'vue'
export default defineComponent({
  setup() {
    // `evt` 将会是 `any` 类型
    const handleChange = evt => {
      console.log(evt.target.value) // 此处 TS 将抛出异常
    }
    return { handleChange }
  }
})
</script>

如你所见,在没有为 evt 参数正确地声明类型的情况下,当我们尝试获取 <input> 元素的值时,TypeScript 将抛出异常。解决方案是将事件的目标转换为正确的类型:

const handleChange = (evt: Event) => {
  console.log((evt.target as HTMLInputElement).value)
}

官网文档连接:为事件处理器添加类型

这篇好文章是转载于:学新通技术网

  • 版权申明: 本站部分内容来自互联网,仅供学习及演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,请提供相关证据及您的身份证明,我们将在收到邮件后48小时内删除。
  • 本站站名: 学新通技术网
  • 本文地址: /boutique/detail/tanhgghafi
系列文章
更多 icon
同类精品
更多 icon
继续加载