《js手写穿梭框》element 两个table表格使用selection复选框之间实现穿梭框，左边选中右边添加，左边取消勾选右边删除。

1.table表格中使用selection属性设置复选框勾选

<el-table-column type="selection" width="40" :reserve-selection="true" />

2.table表格中使用 @selection-change="portSelectionChange" 拿到勾选中得数据

    <el-table
      :data="portListData"
       :border="true"
        :row-key="portRowKey"
        @selection-change="portSelectionChange"
         ref="multipleTablet"
          >
             <el-table-column type="selection" width="40" :reserve-selection="true" />
             <el-table-column label="序号" type="index" width="55" />
             <el-table-column prop="interfaceCode" label="接口编码" width="200" />
              
       </el-table>

const portSelectionChange = (val) => {
    let map = JSON.stringify(val);
    let newmap = JSON.parse(map);
    if (newmap.length > pitchonData.value.length) {
        newmap?.map((item, index) => {
            if (item.id !== pitchonData.value[index]?.id) {
                pitchonData.value.push(item);
            }
        });
    } else if (newmap.length < pitchonData.value.length) {
        let getId = newmap?.map((item) => item.id);
        let arr = pitchonData.value?.filter((item) => !getId?.includes(item.id));

        for (let i = 0; i < pitchonData.value.length; i++) {
            for (let j = 0; j < arr.length; j++) {
                if (pitchonData.value[i].id == arr[j].id) {
                    pitchonData.value?.splice(i, 1);
                }
            }
        }
    }
};