Fabric.js : 仅使用一个变量创建多个对象有什么问题吗？

Question

我为什么要质疑这个？

因为，根据我的代码，我希望用户创建无限的图像，所以它们必须以更短的方式创建，比如对所有图像使用一个变量。

这是我在用户添加图片时调用的函数的代码：

（已编辑：此代码现已修复。）

function addImage(){
    var imageAdded = new Image();
    imageAdded.onload = function (img) {
    var imgAdded = new fabric.Image(imageAdded, {
        clipName: picID,
        clipTo: function (ctx) {
            return _.bind(clipByName, imgAdded)(ctx)
        }
    });
    canvas.add(imgAdded);
    };
    var n = 0;
    if(n == 0){
        n = 1;
        addEventListenerFabric();
    }
}
function addEventListenerFabric(){
    canvas.on("object:selected", function (e) {
        alert(e.target.clipName + " is selected"); // fixed
        canvas.renderAll();
    });
}

我的代码有什么问题？

我的代码会根据图像的数量发出警报。例如，如果用户创建了 3 张图片，则当他 select 一张图片时，它会提醒 3 次。 是不是因为一个变量全用了？（可能是我的代码有问题，请重新检查）

如果无法对所有变量使用一个变量，或者您有更好的解决方案。我将非常有兴趣看到您的评论。

谢谢指教！

Answer 1

这是因为您在每次图像加载时将 object:selected 绑定到 canvas。把它从onload函数中移出来，它只会触发一次。

Fabric.js : 仅使用一个变量创建多个对象有什么问题吗？

Fabric.js : Is there any issue for creating multiple objects using only one variable?

javascript

object

fabricjs