最终效果如下
查看文档穿梭框 Transfer - Ant Design Vue (antdv.com)发现他只有两个部位支持插槽,其实还有
children notFoundContent
因此这里暂时使用了footer部分的插槽来实现
<template #footer>
此处放入多选框代码
</template>
同时使用css中的display布局Flex 布局教程:语法篇 - 阮一峰的网络日志 (ruanyifeng.com)
核心代码
.ant-transfer-list-headr{
order: 1;
}
.ant-transfer-list-body{
order: 3;
}
.ant-transfer-list-footer{
order: 2;
}
但这样就不能在自定义底部了