新建一个示例项目,npx degit dcloudio/uni-preset-vue#vite-ts my-vue3-project
安装完所需环境后,将 index.vue 中代码改为如下所示
<script setup lang="ts">
import { ref, type Ref } from "vue";
const touchEvent: Ref = ref<TouchEvent>();
const canvasTouchStart = (event: TouchEvent): void => {
touchEvent.value = event;
};
</script>
<template>
<canvas
id="canvas"
width="600"
height="600"
style="border: solid black 1px"
@touchstart="canvasTouchStart"
>
</canvas>
<br />
<br />
<view>touchEvent</view>
{{ touchEvent }}
<br />
<br />
<view>touchEvent.touches</view>
{{ touchEvent && JSON.stringify(touchEvent.touches) }}
<br />
<br />
<view>touchEvent.changedTouches</view>
{{ touchEvent && JSON.stringify(touchEvent.changedTouches) }}
</template>
<style></style>
运行后点击 canvas 任一区域,发现返回的 touchEvent.touches 并不是 TouchList 类型,需要自己转化。