Javascript fabric.js中的鼠标：向下与向下

下面是一个fabric.js示例，其中包含一个画布和一个矩形，每个矩形上都有一个鼠标下键处理程序：

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

var rect = new fabric.Rect({ 
  left: 100, 
  top: 100, 
  width: 50, 
  height: 50, 
  fill: '#faa', 
})

canvas.add(rect);

canvas.on('mouse:down', function(options) {
  console.log('canvas event');
});

rect.on('mousedown', function(options) {
  console.log('rect event');
});

为什么画布上的鼠标下键必须是

mouse:down

，而矩形上的鼠标下键必须是

mousedown

？如果我改变其中一个，他们就会停止工作。

mousedown

是否实际上不是结构事件，如果是，处理函数是否应该不同

---

jsiddle:

它们都是fabric js事件。主要区别在于事件所附加的实例类型。

mouse:down

是特定于结构画布实例的事件，而

mousedown

是特定于结构对象实例的事件，在您的示例中是rect

可以在画布和对象实例上侦听不同类型的事件。fabric js官方网站上提供了可用活动的完整列表

---

特定于Canvas实例的事件在图书馆官方GitHub页面中详细介绍。

知道为什么一个有冒号，而另一个没有吗？对于Canvas，它们的前缀是“名称空间”，这为事件提供了逻辑分组。在对象上有与鼠标相关的事件、与对象相关的事件等。另一方面，事件附加到该特定对象，因此无需分组。