javascript - 移动端Web如何实现IOS双击事件。

Question

问题：图片绑定了一个双击事件，双击可切换放大/缩小查看图片，在安卓手机正常响应，但在Chrome浏览器模拟器里双击事件不响应，在苹果手机也不响应；使用的是vue的事件绑定v-on:dblclick="", 暂时不知道原因，麻烦知道的告诉一声，谢谢了！
相关代码如下：

<p id="V_zoom" class="mask J_zoom">
  <header class="cb_header secondary">
    <span @click="closePreImg()" class="back"><i class="angle left large icon"></i>返回</span>
  </header>
  <p class="mask-content" style="display: flex; align-items: center;">
    <p style="min-width: 100vw; text-align: center;">
      <img v-on:dblclick="zoomImage()" :src="photo.image_url" :alt="photo.description" :width="showSize.width" :height="showSize.height">
    </p>
  </p>
  <p class="bottom-text">
    {{ photo.description }}
  </p>
</p>

Answer 1

v-on:dblclick.native="zoomImage()" 试过没

Answer 2

可以这样实现

        var lastClickTime = 0;
        var clickTimer;
        document.getElementById('xxx').addEventListener('click', (event) => {
            var nowTime = new Date().getTime();
            if (nowTime - lastClickTime < 400) {
                /*双击*/
                lastClickTime = 0;
                clickTimer && clearTimeout(clickTimer);
                alert('双击');
                
            } else {
                /*单击*/
                lastClickTime = nowTime;
                clickTimer = setTimeout(() => {
                    alert('单击');
                }, 400);
            }
        });

Answer 3

找了一圈，再次确认下：

• 首先，双击这种交互原生不支持；

• Android有实现双击缩放查看图片的仿微信照片查看器如PhotoView，IOS暂未发现；

• IOS微信客户端由UIWebview升级为WKWebview，对于Web端开发有什么影响？
  IOS网页开发适配指南

原本的实现：除了安卓微信里可响应双击，安卓浏览器/IOS均不响应。

使用hammer.js来实现双击，安卓和IOS微信和浏览器里均可以响应；存在的不足：
１．IOS浏览器里，双击放大图片，当图片大于屏幕宽度时，其网页大小也会有所影响，但微信里不会，由于这些功能只是在微信里使用，此问题不管；
２．有时反应不灵敏。当多次连续操作后，有时会不反应，继续操作才响应