ant design vue2 表格穿梭框 选中复选框 拿到当前值

对于 Ant Design Vue 2 的表格穿梭框中选中复选框的问题，您可以通过自定义渲染函数来实现。具体步骤如下：

1. 在 `data` 中定义 `columns` 数组，用来存放表格的列信息，其中需要定义一个 `customRender` 函数来自定义渲染复选框：

<template>
  <a-transfer :data-source="dataSource" :target-keys="targetKeys">
    <template #render="item">{{ item.title }}</template>
    <template #renderList="item">
      <a-table
        :columns="columns"
        :row-selection="{selectedRowKeys: item.selectedKeys, onChange: item.onChange}"
        :dataSource="item.dataSource"
        :pagination="false"
        :row-key="record => record.key"
      />
    </template>
  </a-transfer>
</template>

<script>
export default {
  data() {
    return {
      dataSource: [
        { key: '1', title: '选项一', checked: false },
        { key: '2', title: '选项二', checked: true },
        { key: '3', title: '选项三', checked: false },
      ],
      targetKeys: [],
      columns: [
        { title: '选项', dataIndex: 'title' },
        {
          title: '选择',
          dataIndex: 'checked',
          customRender: (text, record, index) => {
            return (
              <a-checkbox
                checked={text}
                onChange={e => {
                  record.checked = e.target.checked;
                  this.handleChange();
                }}
              />
            );
          },
        },
      ],
    };
  },
  methods: {
    handleChange() {
      const selectedItems = this.dataSource.filter(item => item.checked);
      const selectedKeys = selectedItems.map(item => item.key);
      console.log('选中的值：', selectedKeys);
    },
  },
};
</script>

在上述代码中，我们自定义了一个 `columns` 数组，其中第二列使用了 `customRender` 函数来自定义渲染复选框。在渲染复选框时，我们监听了 `onChange` 事件，并在事件处理函数中通过修改 `record.checked` 的值来更新数据源。同时，我们在事件处理函数中调用了 `handleChange` 方法来处理选中的值。

2. 在表格穿梭框的 `renderList` 插槽中，使用 `a-table` 组件来渲染列表，并将选中的行传递给表格的 `selectedRowKeys` 属性，同时监听 `onChange` 事件来更新选中的行：

通过上述方法，我们可以自定义渲染复选框，并在选中复选框时获取当前选中的值。