Javascript 织物js。无法对多个矩形进行填充图案

你好，我希望有人能帮我一把

我有一个for语句，它在fabric js画布上创建和添加多个rect。我需要为每个创建的矩形设置纹理，所以我使用以下代码

var rect=new fabric.rect({
宽度：100，
身高：100，
是的，
哈斯：错，
边框颜色：“红色”，
边界宽度：2，
lockMovementX：对，
洛克·莫文蒂：没错
});
canvas.add（rect）；
fabric.util.loadImage（'construct/css/img/patterns/1.jpg'，函数（img）{
直线组（'填充'），新织物图案({
资料来源：img，
重复：“重复”
}));
});
我的假设是对所有矩形使用相同的变量rect，这就是为什么对最后一个对象使用模式。
例如，您将添加4个矩形：

for (var i = 0; i < 4; i++){
    var rect = new fabric.Rect({
    width: 100,
    height: 100,
    left: i * 110,
    selectable: true,
    hasControls: false,
    borderColor: 'red',
    borderWidth: 2,
    lockMovementX: true,
    lockMovementY: true
  });

  canvas.add(rect);
}

工作代码

警告：如果除矩形外还有其他对象，则需要通过检查对象类型来忽略它们，或者将某种自定义形状类型设置为矩形。
我的假设是，所有矩形都使用相同的变量rect，这就是为什么只有最后一个对象使用模式。
例如，您将添加4个矩形：

for (var i = 0; i < 4; i++){
    var rect = new fabric.Rect({
    width: 100,
    height: 100,
    left: i * 110,
    selectable: true,
    hasControls: false,
    borderColor: 'red',
    borderWidth: 2,
    lockMovementX: true,
    lockMovementY: true
  });

  canvas.add(rect);
}

工作代码

警告：如果除矩形外还有其他对象，则需要通过选中对象类型忽略它们，或将某种自定义形状类型设置为矩形。
如果我回答了您的问题，请接受答案如果我回答了您的问题，请接受答案