fabric.js 获取 "edit" IText 对象的状态

Question

在 fabric.js 中，我想在我的 canvas 中添加一些关键交互。如果一个 IText 对象被 selected，我希望在我按下 "del" 键时删除它。我通过以下方式完成了这项工作：

$('html').keyup(function(e){
  if (e.keyCode == 46) {
    obj = canvas.getActiveObject();
    canvas.remove(obj);
  }
});

现在的问题是，当我正在编辑 IText 并按下 DEL 键时，对象显然也被删除了。我想通过这样的方式来防止这种情况：

$('html').keyup(function(e){

  canvas.observe('text:editing:entered', editing = true);

  console.log(editing);

  if (editing == false) {
    if (e.keyCode == 46) {
      removeObject();
    }
  };

});

= 仅当我不在编辑 IText 时删除对象

我在这里发现了这场火灾 "editing:entered"：http://fabricjs.com/docs/fabric.IText.html 所以我试着用上面的代码来捕捉这个。但是，当我 select 文本并没有真正开始编辑它时，看起来这个事件已经触发了。

关于如何解决这个问题并检查我是否真的只是在编辑 IText 有什么想法吗？

Answer 1

IText 对象有一个名为 isEditing 的属性，可用于检查对象中的文本是否正在编辑。

要实现您所说的，您所要做的就是在从 canvas 中删除对象之前检查此属性。代码如下所示：

document.onkeyup = function (e) {
    if (e.keyCode == 46) {
        obj = canvas.getActiveObject();
        if (!obj.isEditing) {
            canvas.remove(obj);
        }
    }
};

这是 fiddle：http://jsfiddle.net/bdgnrnxf/1/ and link to the documentation。

fabric.js 获取 "edit" IText 对象的状态

fabric.js get "edit" state of IText object

javascript

fabricjs