ant-design 中a-transfer穿梭框 组件的使用

        项目中用到了a-transfer穿梭框，正好整理一下使用的方法：主要功能是要实现，左侧列表的数据选中后点击按钮，选中的项能进入右侧列表：

例如下图：

组件是使用代码：

         <a-transfer
            :data-source="fieldData"
            show-search
            :list-style="{
              width: 'calc(50% - 59px)',
              height: '300px',
            }"
            :operations="['添加', '撤回']"
            :target-keys="targetKeys"
            :render="(item) => `${item.title}`"
            @change="handleChange"
          >
            <span slot="notFoundContent"> 没数据 </span>
          </a-transfer>

其中数据源fielData是数组[{key:'NAME',value:'名称',......}].

handleChange方法获取选中的项，

  handleChange(targetKeys, direction, moveKeys) {
      this.targetKeys = targetKeys; // 进入右侧的项
    }

其中this.targetKeys就是所有选中到右侧的项。