前端react+Ant Design 给穿梭框Transfer 添加导入导出按钮，难点在于导入数据后怎么赋值给右侧

收到需求是：在穿梭框上加导出导入按钮，导出全部数据，导入数据后，在右侧穿梭框出现数据。难点在于导入数据后，怎么绑值，让数据出现在右侧框。减少用户对数据的勾选。这样用户可以在导出的表格中操作，在导入到穿梭框中。穿梭框 Transfer - Ant Design网址。

前端：

1.先添加按钮，上代码。

import 'moment/locale/zh-cn'

import { Button, Col, DatePicker, Form, Modal, notification, Row, Select } from 'antd'

import axios from 'axios'

import { assign } from 'lodash'

import InputFileDb from 'modules/relative/rqrj/InputFileDb'

import moment from 'moment'

import { useState } from 'react'

import { useMutation, useQueryClient } from 'react-query'

import { DownloadOutlined, FileExcelOutlined } from '@ant-design/icons'

import { useFormSubmit, useModal } from '@asiic/hooks'

import { defaultFormItemLayout } from '@asiic/utils'

import { Relativeurl, YjyaCreateType } from '../../relative/type'

import TableTransfer from '../../TableTransfer'

import type { ColumnsType } from 'antd/es/table/interface'

/**

 * 编辑角色.

 */

export const EditModal = ({ initialValues, close }: ModalParentProps<Partial<YjyaCreateType>>): JSX.Element => {

  const [listData, setListData] = useState<[]>(initialValues?.data ? initialValues?.data : []);

  const submit = useFormSubmit(Relativeurl.rqrjpost);

  const [form] = Form.useForm<YjyaCreateType>();

  const fdata = JSON.parse(JSON.stringify(initialValues));//表单

  const queryClient = useQueryClient();

  const securl = Relativeurl.rqrjpost;

  const url = Relativeurl.relateProject;

  const [modalExcel, openWithExcel, closeExcel] = useModal<Partial<YjyaCreateType>>(); //导入窗口

  const [pointNameArr, setPointNameArr] = useState('');

  // 导入

  function newCloseExcel() {

    closeExcel();

    form.validateFields().then(() => {

      queryClient.invalidateQueries('/relateDailySettlement');

    });

  }

  // 导出

  function dowlnexcel(form: Record<string, unknown>) {

    // form = { orgID: orgId.current ,pointName:pointName.current};

    axios

      .post('/caseInfo/excelDown', form, {

        responseType: 'blob',

      })

      .then((res) => {

        const disposition = res.headers['content-disposition']; // 获得二进制流在浏览器缓存中，做流转发下载

        const filename = decodeURIComponent(disposition.split('filename=')[1]); //获得文件名称 //这里res.data是返回的blob对象

        const blob = new Blob([res.data], { type: 'application/vnd.ms-excel' });

        const a = document.createElement('a');

        const href = window.URL.createObjectURL(blob); //创建下载的链接

        a.href = href;

        a.download = filename; //下载后文件名

        document.body.appendChild(a);

        a.click(); //点击下载

        document.body.removeChild(a); //下载完成移除元素

        window.URL.revokeObjectURL(href); //释放掉blob对象

      });

  }

  const leftTableColumns: ColumnsType<YjyaCreateType> = [

    {

      title: '姓名',

      dataIndex: 'userName',

      width: 90

    },

    {

      title: '临时卡号',

      dataIndex: 'userNo',

      width: 100,

      sorter: {

        compare: (a, b) => a.userNo - b.userNo,

      },

    },

    {

      title: '联系电话',

      dataIndex: 'tel',

      width: 100,

    },

    {

      title: '身份证号',

      dataIndex: 'cardNo',

      width: 160,

      sorter: {

        compare: (a, b) => a.cardNo - b.cardNo,

      },

    },

    {

      title: '性别',

      dataIndex: 'sex',

      width: 60,

    },

    {

      title: '其他计划',

      dataIndex: 'isExist',

      width: 80,

      align: 'center',

      render: (_, record) => (

        <div style={ {

          width: 40,

          lineHeight: '20px',

          height: 20,

          backgroundColor: record.isExist === '有' ? '#dbdb0f' : '#63b963',

          textAlign: 'center',

          color: 'white',

          marginLeft: 18,

          borderRadius: 5

        }}>

          {record.isExist}

  &nb