iOS DeviceOrientationEvent API &类型记录

Question

我为@on: iOS回调设置了以下设置，该回调旨在向用户请求iOS Safari设备的iOS API的权限：

const setDeviceOrientationPermission = async () => {
  if (typeof DeviceOrientationEvent.requestPermission === 'function') {
    deviceOrientationPermissionState.value = await DeviceOrientationEvent.requestPermission()
  }
}

当我在Vue 3+ Tyepscript世界做这件事时，我设置了deviceOrientationPermissionState，这是一个参考文献(更多关于参考文献：https://v3.vuejs.org/guide/reactivity-fundamentals.html)

这些代码都在工作，当加载Safari iOS或webkit iOS浏览器时，需要获得权限，在回调时，我可以访问设备的方向。

然而，打字稿不喜欢。

打字本给了我这个错误：

Property 'requestPermission' does not exist on type '{ new (type: string, eventInitDict?: DeviceOrientationEventInit | undefined): DeviceOrientationEvent; prototype: DeviceOrientationEvent; }'.

当我按照我的打字本知识最好地修复错误时，代码就不再工作了。

所以..。我开始将接口声明为：

declare interface DeviceOrientationEvent {
  webkitCompassHeading: number | null
  webkitCompassAccuracy: number | null
  requestPermission: () => Promise<PermissionState>
}

enum PermissionState {
  "granted",
  "denied",
}

但是，打字稿还是不喜欢的。

有人能告诉我我做错了什么，如何在Safari上工作，也允许我和打字稿保持最好的伙伴关系吗？

Answer 1

今天在用VS代码编译我们的ReactJS应用程序时遇到了同样的问题。为了绕过TypeScript中缺少的方法，我只为这一行将DeviceOrientationEvent抛给了任意一个。

const setDeviceOrientationPermission = async () => {
  if (typeof (DeviceOrientationEvent as any).requestPermission === 'function') {
    deviceOrientationPermissionState.value = await (DeviceOrientationEvent as any).requestPermission()
  }
}