孔季雅 发表于 2025-8-28 17:29:21

vue table 甘特图 vxe-gantt 实现多个表格的任务互相拖拽数据

vue table 甘特图 vxe-gantt 实现多个表格的任务互相拖拽数据
对于需要实现多表数据互相拖拽的场景就非常有用了,实现方式非常简单
查看官网:https://vxeui.com
Github:https://github.com/x-extends/vxe-gantt
Gitee:https://gitee.com/x-extends/vxe-gantt
效果


代码

通过参数 row-drag-config.isCrossTableDrag 启用跨表格、多表格互相拖拽。跨表拖拽需要确保数据主键不重复,通过 row-config.keyField 指定主键字段名
<template>

    <vxe-button status="success" @click="resultEvent1">获取数据1</vxe-button>
    <vxe-gantt ref="ganttRef1" v-bind="ganttOptions1"></vxe-gantt>

    <vxe-button status="success" @click="resultEvent2">获取数据2</vxe-button>
    <vxe-gantt ref="ganttRef2" v-bind="ganttOptions2"></vxe-gantt>

    <vxe-button status="success" @click="resultEvent3">获取数据3</vxe-button>
    <vxe-gantt ref="ganttRef3" v-bind="ganttOptions3"></vxe-gantt>

</template>https://gitee.com/x-extends/vxe-gantt

来源:程序园用户自行投稿发布,如果侵权,请联系站长删除
免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!
页: [1]
查看完整版本: vue table 甘特图 vxe-gantt 实现多个表格的任务互相拖拽数据