你好，关于选中问题，下面是我的代码。为啥这个项目中，这样写代码之后，第一次会选不中，点击第二才选中。也就是第一次框选不中，第二次才可以框选中

[huangwenboha563]

const canvas = canvasEditor.canvas;
const circle1 = new fabric.Circle({
radius: 50,
fill: 'red',
left: 200,
top: 200,
});
const circle2 = new fabric.Circle({
radius: 50,
fill: 'green',
left: 100,
top: 0,
});

const url =
'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fc-ssl.duitang.com%2Fuploads%2Fitem%2F201702%2F21%2F20170221230517_J8jAW.thumb.1000_0.jpeg&refer=http%3A%2F%2Fc-ssl.duitang.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1699510542&t=dbbe6f9cc97643c88214a138c147fbee';
fabric.Image.fromURL(url, function (oImg) {
// 在添加到画布之前，缩小图像, 并使其翻转。
oImg.scale(0.08).set('flipX', false);
oImg.set({
stroke: 'blue',
strokeWidth: 10,
strokeDashArray: [5, 5], // 设置虚线样式
});

const group = new fabric.Group([circle1, circle2, oImg], {
  left: 200,
  top: 100,
  selectable: false,
});

canvas.add(group);

group.on('mousedown', function () {
  console.log('Group has been clicked');
});
// 鼠标按下事件
canvas.on('mouse:down', function (options) {
  console.log('mouse:down', options.e.clientX, options.e.clientY);
});

// 鼠标移动事件
canvas.on('mouse:move', function (options) {
  // console.log(options.e.clientX, options.e.clientY);
});

// 鼠标抬起事件
canvas.on('mouse:up', function (options) {
  console.log('Mouse Up');
});
// Listen for the selection event
canvas.on('selection:created', function (e) {
  console.log('selection created');
});

canvas.on('selection:updated', function (e) {
  console.log('selection updated');
});

});

[huangwenboha563]

如果我有表达不准确感谢指正。代码可以直接复制粘贴呈现效果。

[huangwenboha563]

在这个项目中，我绘制了两个矩形和一个图片，把这三个搞成一个group，然后设置这个group的selectable属性，按理来说设置为true就可以选中不管是点击选中还是框选选中，fasle则反之。但是在咱们这个项目中呈现的是如果我设置为false,第一次选不中，第二次为啥还能选中。同样的代码我脱离这个项目是对的，true就是能选中，false就是选不中。补充：不管我设置这个group的selectable为true还是false都是第一次选不中，第二次就选中了。

[huangwenboha563]

经过再次测试，咱这个项目好像对group做过初始化处理？

[nihaojob]

@huangwenboha563 是否可以提供是复现的Gif步骤，能够直观的看出来如何操作