Closed weiShaoY closed 1 year ago
<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全部一样,然后导致绑值也是一样的了
希望可以提供复现案例,以帮助我们更快的解决问题,因为它在文档中的运行是正确的
const clone = (element: any) => { // 为拖拽到容器的元素添加唯一 key
// 给拖拽的元素添加唯一 key element.key = new Date().getTime().toString() + "_" + Math.ceil(Math.random() * 99999);
return element; // 返回克隆的元素 }; 我想每次拖动克隆给每个都加个唯一的key, 但发现一个问题,如果我多次克隆左边的同一项到右边,会导致key全部一样,然后导致绑值也是一样的了![f5f64476bc652cdce00a7d1079f6ed6](https://user-images.githubusercontent.com/56295518/229348468-4b895c75-40c6-4c1a-8b9f-fb24a62f7b4b.png)