How to group and ungroup elements

[jiangxiaoxilsy]

// 我的代码（Function not effective）：
<Moveable
:key="renderKey"
ref="moveableRef"
:draggable="true"
:rotatable="true"
:resizable="true"
:target="targets"
:view-container="rootContainer"
:snappable="true"
:snap-directions="({ top: true, left: true, bottom: true, right: true, center: true, middle: true })"
:element-snap-directions="({ top: true, left: true, bottom: true, right: true, center: true, middle: true })"
:max-snap-element-guideline-distance="70"
:element-guidelines="chartList.map(chart => '.cube' + chart.code)"
@ClickGroup="onClickGroup"
@drAg="onDrag"
@resize="onResize"
@rotate="onRotate"
@Dragend="onDragEnd"
@resizeEnd="onResizeEnd"
@rotateEnd="onRotateEnd"
@dragGroup="onDragGroup"
@resizeGroup="onResizeGroup"
@rotateGroup="onRotateGroup"
@RenderGroup="onRenderGroup"
/>
<Selecto
:key="renderKey + '2'"
ref="selectoRef"
:drag-container="window"
:selectable-targets="['.selecto-area .cube']"
:hit-rate="0"
:select-by-click="true"
:select-from-inside="false"
:toggle-continue-select="[['ctrl'],['shift'],['meta']]"
:ratio="0"
:root-container="rootContainer"
@dragstart="onDragStart"
@selectEnd="onSelectEnd"
/>
onSelectEnd (e) {
this.targets = e.selected?.filter(target => {
const code = target?.getAttribute('data-code')
const _config = this.canvasInst.getChartInst(code)?.config
return (!_config?.locked)
})

  // 点击组件时默认高亮对应图层
  const code = this.targets[0]?.getAttribute('data-code')
  this.canvasInst.updateActiveCoverage(code)
}
// 组合元素
groupItem () {
  let targets = cloneDeep(this.canvasInst.targets)
  console.log('组合元素1', targets)
  const nextGroup = this.groupManager.group(targets, true)
  if (nextGroup) {
    targets = nextGroup
  }
  console.log('组合元素2', nextGroup)
  this.canvasInst.updateTargets(targets)
}