【问题标题】：How to trigger fabric.js "object:modified" event programmatically?如何以编程方式触发fabric.js“object：modified”事件？
【发布时间】：2020-12-11 00:08:02
【问题描述】：

我想以编程方式触发“object:modified”事件。我已经尝试过使用“fire”和“trigger”方法。

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/

【问题讨论】：

标签： javascript fabricjs

【解决方案1】：

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

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

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

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

【讨论】：

感谢我所需要的。我怎么想念选项参数？真丢脸:)
您也可以使用触发方法而不传递对象。例如，我的项目在任何对象修改事件上调用一个函数，所以我使用这样的触发方法：canvas.trigger('object:modified')

【解决方案2】：

版本 4 重大更改

同时你应该使用fire。

canvas.fire('object:modified');

在可观察的 mixin 中，observe、stopObserving、trigger 被删除。继续使用on、off、fire。那些更短，也是我们所有的文档引用了这种名称。

更多详情请见Version 4 breaking changes。

【讨论】：