当对象被拖到画布上时，如何触发 fabric.js 'object:moving' 事件？

Question

我目前正在使用fabric.js 库开发一个应用程序，在该库中我在fabric.js 画布上绘制了一个矩形对象，该画布上设置了图像背景。我可以绘制矩形，但是当我单击矩形移动它时，'object:moving' 事件根本不会被触发，并且在移动当前选定的矩形时会绘制一个新矩形。有没有办法在移动当前选定的矩形对象时停止绘制新的矩形对象？下面是我的 JavaScript 代码。$scope.c 是范围内的画布变量。

$scope.rect = new fabric.Rect({
    top: $scope.origY,
    left: $scope.origX,
    width: 0,
    height: 0,
    fill: 'gold',
    stroke: 'red',
    strokewidth: 4.5,
    opacity: 0.5,
    name: 'UserArea_'
});

$scope.c.add($scope.rect);

});

$scope.c.on('mouse:move', function(o) {
    if (!$scope.isDown) {
        return
    };

    var pointer = $scope.c.getPointer(o.e);

    if ($scope.origX > pointer.x) {
        $scope.rect.set({
            left: Math.abs(pointer.x)
        });
    }
    if ($scope.origY > pointer.y) {
        $scope.rect.set({
            top: Math.abs(pointer.y)
        });
    }

    $scope.rect.set({
        width: Math.abs($scope.origX - pointer.x)
    });
    $scope.rect.set({
        height: Math.abs($scope.origY - pointer.y)
    });
    $scope.rect.setCoords();

});

$scope.c.on('mouse:up', function(o) {
    $scope.isDown = false;
});

$scope.c.on('object:selected', function(e) {
    var activeObj = $scope.c.getActiveObject(); {
        console.log(activeObj.width);
    }

});

$scope.c.on('object: moving', function(e) {


    console.log('object is moving');

});

Answer 1

您在事件名称“对象：移动”中有一个空格，应该是：

$scope.c.on('object:moving', function(e) {


    console.log('object is moving');

});