vuedraggable左右两列互相拖拽如果用的clone的话，那么如果拖拽到右侧，然后修改拖拽到右侧的数据的话那么就会影响到左侧的数据？

Question

vuedraggable左右两列互相拖拽如果用的clone的话，那么如果拖拽到右侧，然后修改拖拽到右侧的数据的话那么就会影响到左侧的数据，我拷贝了也不行，不知道为什么

Answer 1

你看看这个下面的实现：

<draggable
  v-model="leftList"
  @change="onChange"
  :options="{
    group: { name: 'shared', pull: 'clone', put: false },
    sort: false,
  }"
>
  <!-- Left list items  -->
</draggable>

<draggable
  v-model="rightList"
  @change="onChange"
  :options="{
    group: { name: 'shared', pull: false, put: true },
  }"
>
  <!-- Right list items  -->
</draggable>



export default {
  data() {
    return {
      leftList: [
        
      ],
      rightList: [
        
      ],
    };
  },
  methods: {
    onChange(event) {
      if (event.added && event.added.element) {
        const newItem = JSON.parse(JSON.stringify(event.added.element));
        this.$set(this.rightList, event.added.newIndex, newItem);
      }
    },
  },
};