IOS 设备键盘未在单击事件 itext 中打开 Angular 9

问题描述

我将fabricjs 用于画布,将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 尝试了上述解决方案。

请推荐。 提前致谢

解决方法

通过使用 VanilaJS touchend 事件找到了一种方法。必须删除 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;
  }
});

谢谢 :) 继续编码