Fabric.js ActiveSelection subTargetCheck 属性

在 Fabric.js 中，ActiveSelection 是一个特殊的对象，它包含了多个被选中的对象。当我们对 ActiveSelection 进行操作时，通常会遍历其中包含的子对象进行操作。而 subTargetCheck 属性就是控制每个子对象是否适合被选中的属性。

属性说明

subTargetCheck 是 ActiveSelection 对象的一个布尔类型属性，默认值为 false。当其设置为 true 时，ActiveSelection 对象会对包含的每个子对象调用 shouldRender 函数，来判断是否将其加入 subTargets 数组中，并在鼠标事件中使用。

使用方法

要启用 subTargetCheck 属性，只需要将 ActiveSelection 对象的 subTargetCheck 属性设置为 true 即可。

const activeSelection = new fabric.ActiveSelection(objects, {
  subTargetCheck: true
});

shouldRender 函数

shouldRender 函数是一个用于判断子对象是否适合被选中的函数，返回值为布尔类型。如果 shouldRender 返回值为 true，则该子对象将会被加入 subTargets 数组中，并在后续的鼠标事件中使用。

以下是一个简单的 shouldRender 函数示例：

function shouldRender(subTarget) {
  return subTarget.selectable && subTarget.visible;
}

该函数判断了子对象是否可选和是否可见，并返回布尔类型值。

总结

subTargetCheck 属性在 Fabric.js 中的使用十分灵活，可以根据实际需求编写自定义的 shouldRender 函数来控制子对象的选中。同时，在使用时也需要注意该属性会增加计算量，并对性能有一定影响，需要根据实际情况进行权衡。