javascript - FabricJS:对象控件在共同选择之前不起作用

Question

我正在使用 Vue 和 FabricJS 创建一个产品配置器。
我创建了一个 Canvas 使用

this.canvas = new fabric.Canvas("canvas");

<template>
  <div id="wrapper">
    <div id="left"></div>
    <canvas id="canvas"/>
  </div>
</template>

在我将对象添加到 Canvas (IText、文本框、图像，使用 new fabric.IText(...))并用鼠标选择它后，我无法使用对象控件来调整大小、缩放、倾斜或旋转对象。但是，我可以在 Canvas 上移动对象。添加另一个对象后，一次选择它们并再次取消选择，控件突然按预期工作。我无法在 JsFiddle 上重现该问题，一切正常。
Controls not working until both objects are selected
我使用各种浏览器遇到了这个问题。
我是否缺少一些 Canvas 属性，它在添加后立即启用？或者这是 Fabric.js 中的一个错误？

Answer 1

一段时间后，我使用了一种解决方法:
我在创建它之后立即向 Canvas 添加了一个空的帮助对象，然后在添加每个新对象后，我以编程方式选择并取消选择所有这些对象。之后，所有对象的行为都正确。我知道这是一个“黑客”，但它有效:)

this.canvas = new fabric.Canvas("canvas", {
    ...canvasProps
});

const helperObj = new fabric.Object({});    //abstract invisible object
helperObj.set("selectable", false);         //so the user is not able to select and modify it manually
this.canvas.add(helperObj);

this.canvas.on("object:added", () => {
  //workaround - selecting all objects to enable object controls

  let objects = this.canvas.getObjects();
  var selection = new fabric.ActiveSelection(objects, {
     canvas: this.canvas,
  });
  this.canvas.setActiveObject(selection);   //selecting all objects...
  this.canvas.discardActiveObject();        //...and deselecting them
  this.canvas.requestRenderAll();
});