clone有问题

[weiShaoY]

<div class="main">
  <a-card title="可选控件" class="main-left">
    <template v-if="leftDraggableArray.length">
      <VueDraggable
        class="draggableWrap"
        v-model="leftDraggableArray"
        ghostClass="ghost"
        :group="{ name: 'people', pull: 'clone', put: false }"
        :sort="false"
        :clone="clone"
      >
        <div
          v-for="leftItem in leftDraggableArray"
          :key="leftItem.name"
          class="leftDraggableItem"
        >
          <icon-formula />
          {{ leftItem.type }}
        </div>
      </VueDraggable>
    </template>
  </a-card>

  <a-card title="任务设计器主体" class="main-center">
    <a-form class="center-form" :model="centerForm" :size="centerForm.config.size">
      <VueDraggable
        class="draggableWrap"
        v-model="centerForm.list"
        animation="150"
        group="people"
        ghostClass="centerGhost"
      >
        <template
          v-for="(centerFormItem, index) in centerForm.list"
          :key="centerFormItem.key"
        >
          <!-- 判断是否为删格布局 start-->
          <template v-if="centerFormItem.type == 'grid'">
            <a-row
              v-if="centerFormItem && centerFormItem.key"
              :gutter="
                centerFormItem.options.gutter ? centerFormItem.options.gutter : 0
              "
              :justify="centerFormItem.options.justify"
              :align="centerFormItem.options.align"
            >
              <a-col :span="8">
                <FormItem />
                gird 布局,暂时不做
              </a-col>
            </a-row>
          </template>
          <!-- 判断是否为删格布局 end-->

          <!-- 其他类型的元素，直接渲染为表单项  start-->
          <template v-else>
            <FormItem
              v-if="centerFormItem && centerFormItem.key"
              :centerFormItem="centerFormItem"
              :index="index"
              :centerForm="centerForm"
            />
            {{ centerFormItem.key }}
          </template>
          <!-- 其他类型的元素，直接渲染为表单项  end-->
        </template>
      </VueDraggable>
    </a-form>
  </a-card>

  <a-card title="属性配置" class="main-right"> 最右边 </a-card>
</div>
这个是我的代码然后clone 方法如下:

const clone = (element: any) => {
// 为拖拽到容器的元素添加唯一 key

// 给拖拽的元素添加唯一 key
element.key = new Date().getTime().toString() + "_" + Math.ceil(Math.random() * 99999);

return element; // 返回克隆的元素
};
我想每次拖动克隆给每个都加个唯一的key,
但发现一个问题,如果我多次克隆左边的同一项到右边,会导致key全部一样,然后导致绑值也是一样的了

[Alfred-Skyblue]

希望可以提供复现案例，以帮助我们更快的解决问题，因为它在文档中的运行是正确的