vue中使用gantt-elastic实现可拖拽甘特图的示例代码

官方例子效果图：

可以横向以及纵向鼠标拖拽表格滑动。可以手动调整列宽等功能

1、安装gantt-elastic

npm install --save gantt-elastic

2、安装gantt-elastic-header

npm install --save gantt-elastic-header

3、当然你项目里面没有安装dayjs的话还需要安装一下，因为他官网的例子用到了

npm install dayjs --save

4、到这里如果你项目里面安了less-loader可能会报错

说你的less-loader版本太高，必须是2.3.1或者3.0.0版本 ，因为我的是5.0版本的

 此时需要再次安装指定版本的less-loader

 npm install [email protected] --save

然后再次安装dayjs。就ok了

 5、官方例子全代码。复制粘贴即可。

运行成功就是这样的页面了。

当然他不一定符合你的需求比如表头设置，因此需要通过设置参数数据去实现不同的效果。

缺点：没有开发文档，英文的都没有，很多参数设置需要自己研究。如果改动不大的话还可以参考，跟需求差的多的话不建议使用~~

到此这篇关于vue中使用gantt-elastic实现可拖拽甘特图的文章就介绍到这了,更多相关vue可拖拽甘特图内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！