javascript - 在 FabricJS 中删除多个路径

Question

我正在使用 Fabric 创建协作绘图应用程序。由于此应用的性质，人们最好一次删除所有行，而不是实现某种撤消/删除功能。

我试过遍历 path 列表，如下所示:

canvas.getObjects().forEach((path) => {
  if(path.senderId === client.id){
    canvas.remove(path);
  }
});

// Or

let paths = canvas.getObjects().filter(path => path.senderId === client.id);

while(paths.length) {
  canvas.remove(paths[0]);
}

第一个不起作用，因为删除路径会修改数组的长度(如讨论的 here )。但是，第二个永远运行，我不确定为什么。

如果这是错误的方法，请告诉我。谢谢!

Answer 1

一个简洁明了的方法是:

canvas.getObjects('path').forEach((path) => {
  if(path.senderId === client.id){
    canvas.remove(path);
  }
});

通过这种方式，getObjects 将返回一个新数组，您应该能够删除它们而不会对正在处理的数组感到生气。

我相信 getObjects() 应该总是返回一个浅拷贝以便于处理这些情况。如果有人有一些性能问题，仍然可以直接访问 canvas._objects。