javascript - 如何以编程方式触发fabric.js "object:modified"事件？

Question

我想以编程方式触发 'object:modified' 事件。我已经尝试过“开火”和“触发”方法。

var canvas = new fabric.Canvas('c');

canvas.on("object:modified", function (e) {
    alert("object modified");
});

var text = new fabric.Text('Text', {
  fontFamily: 'Hoefler Text',
  left: 10,
  top: 10
});

canvas.add(text);

$('.fillText').click(function(){
  text.setFill($(this).data('color'));
  canvas.renderAll();

  text.trigger('modified');
});

$('#moveText').click(function(){
  text.setLeft(50);
  text.setTop(50);
  text.setCoords();
  canvas.renderAll();

  text.trigger('modified');
});

https://jsfiddle.net/gb4u85q4/

Answer 1

您可以使用 canvas.trigger('<eventname>', options); 触发事件. fire已弃用，因此您可能应该避免使用它。

既然你想触发 object:modified ，您可以通过以下方式执行此操作，同时传递修改了哪个对象:

canvas.trigger('object:modified', {target: text});

我更新了你的 JSFiddle添加解决方案。 :)
(请注意，我将 alert 更改为 console.log，因为我发现警报很烦人，您可以在开发人员工具中查看 console.log 的输出，例如可以通过按 F12 在 Google Chrome 中打开)