寒山远黛
寒山远黛
  • 发布:2023-03-01 10:32
  • 更新:2023-03-01 10:32
  • 阅读:117

【报Bug】canvas @touch{start,move,end} 返回的事件类型不符合规范

分类:uni-app

产品分类: uniapp/App

PC开发环境操作系统: Mac

PC开发环境操作系统版本号: 12.6.3

手机系统: Android

手机系统版本号: Android 12

手机厂商: 小米

手机机型: redmi k50

页面类型: vue

vue版本: vue3

打包方式: 云端

项目创建方式: CLI

CLI版本号: 3.0.0-alpha-3070620230227001

操作步骤:

新建一个示例项目,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 类型,需要自己转化。

预期结果:

touches 和 changedTouches 符合规范

实际结果:

touches 和 changedTouches 需要自己用 Object.values() 转换,但在 TouchList 类型中这两个变量是不可变类型,在 ts 中会报错

bug描述:

@touchstart @touchmove @touchend 根据规范都应返回 TouchEvent 类型,其中 touches 和 changedTouches 都应为 TouchList 类型,但实际上返回的是一个普通对象

2023-03-01 10:32 负责人:无 分享
已邀请:

要回复问题请先登录注册