ios - IOS设备键盘在单击事件时未打开itext插入带有Angular 9的fabricjshammerjs

Question

我将fabricjs用于canvas，将hammerjs用于Angular 9的触摸事件。我有一个hammerjs的单击事件，它创建了一个fabric的IText对象。单击可创建织物并将其填充到画布上，但设备键盘未打开以在文本对象中添加文本。fabricjs 的 IText 在内部创建TEXTAREA以允许文本输入。

试过：

1. canvas.getActiveObject().enterEditing(); 
   canvas.getActiveObject().hiddenTextarea.focus();
2. document.querySelector('[data-fabric-hiddentextarea]').setAttribute("autofocus", "");
   document.querySelector('[data-fabric-hiddentextarea]').focus();
   document.querySelector('[data-fabric-hiddentextarea]').click();

上面的解决方案也用 settimeout 进行了尝试。

请建议。提前致谢

标签： iosfabricjstouch-eventhammer.jsfabricjs2

Answer 1

通过使用 VanilaJStouchend事件找到了一种方法。不得不删除 HammerJS 的doubletap事件并使用touchend事件。

let element = document.getElementById('canvasId');
let timedout;
let lastTaped = 0;
element.addEventListener('touchend', (event) => {
    var currentTime = new Date().getTime();
    var tapLength = currentTime - lastTaped;
    clearTimeout(timedout);
    if (tapLength < 500 && tapLength > 0) {
      // code to add the iText object
      event.preventDefault();
    }
    lastTaped = currentTime;
  }
});

谢谢 :) 继续编码