javascript - FabricJS - 避免在对象结束移动后触发 "canvas.on(' 鼠标 :up', function() { ... })"

Question

我正在使用 FabricJS 制作一个可以添加矩形的 Canvas 。将矩形添加到 Canvas 后，可以将其拖动到任何位置。

我的问题是当我停止拖动矩形时，事件:

canvas.on('mouse:up', function(element) { ... });

被触发，但这是不受欢迎的行为。

如何触发事件:

canvas.on('mouse:up', function(element) { ... });

只有当有效点击鼠标左键时，而不是当我结束拖动对象时？

Answer 1

你可以这样做:

var _isDragging = false;
var _isMouseDown = false;

canvas.on('mouse:down', function () {
    _isMouseDown = true;
    // other stuff
});

canvas.on('mouse:move', function () {
    _isDragging = _isMouseDown;
    // other stuff
})

canvas.on('mouse:up', function(element) {
    _isMouseDown = false;
    var isDragEnd = _isDragging;
    _isDragging = false;
    if (isDragEnd) {
        // code for drag complete
    } else {
        // code for no drag mouse up
    }
    // code for both
});