// 行拖拽 rowDrop() { // 此时找到的元素是要拖拽元素的父容器 const tbody: any = document.querySelector('.el-table__body-wrapper tbody') const _this = this Sortable.create(tbody, { // 指定父元素下可被拖拽的子元素 draggable: '.el-table__row', onEnd({ newIndex, oldIndex }: any)...
我们公司管理后台项目是使用Element-ui组件,这次需求产品要求上传的图片组允许拖拽排序,我就想用vue-draggable插件了,但是相信Element-ui的el-upload组件封装的很好,我这种菜鸟级别的前端哪里敢动,所以我就想着上传依然用el-upload,但是把上传组件的展示图片隐藏,自己根据组件的上传之后拿到的url链接自己形成图片数组,然后...
* 如果从上往下拖拽,即newIndex > oldIndex,那么在目标位置对应记录行上移(目标位置对应记录行索引值减1),在newIndex所指位置插入被拖拽行(被拖拽行索引设置为newIndex),视觉效果就是在after位置(即目标位置对应行下方)插入被拖拽行 * 如果从下往上拖拽,即newIndex < oldIndex,那么在目标位置对应记录行下移(目标位...
最近项目中需要制作一个下拉滚动分页的功能(如下图展示),今天分享一下这个组件功能。希望能抛砖引玉,给大家带来启发。 🔍需求功能 1.数据量大了就页面渲染缓慢从而卡顿严重,为了解决这个问题,对element-ui进行了改造,el-select改为分页滚动加载。 2.数据量大时下拉可以分页滚动加载,而且可以支持原来的搜索。 👣...
element-ui:基于MVVM框架Vue开源出来的一套前端ui组件。 avue: 用该组件包裹后可以变成拖拽组件,采用相对于父类绝对定位;用键盘的上下左右也可以控制移动 vue-echarts: vue-echarts是封装后的vue插件,基于 ECharts v4.0.1+ 开发 vue-superslide: Vue-SuperSlide(Github) 是 SuperSlide 的 Vue 封装版本 ...
插件描述:基于vuedraggable的项目看板拖拽实例,支持多个任务以及任务之间的拖拽 更新时间:2022-05-19 01:29:01 更新说明:修复了cdn静态资源,将静态资源本地化 更新时间:2021-01-01 23:15:09 更新说明:增加屏幕自适应,修复bug。 更新时间:2020-12-03 23:16:02...
vue + vue-router + axios + vuedraggable + element-ui 后端 node + express + mongodb + mongoose 功能列表 登录、注册模块 表单模块 表单模板模块 个人信息模块 管理员模块 功能结构图 [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-ndMPhWAR-1574492320665)(./img/demo.png)] ...
基于VUE+ElementUI+JsPlumb,通过 vuedraggable 插件来实现节点拖拽。 原地址: https://gitee.com/xiaoka2017/easy-flow
动态表单,VUE动态表单。基于vue+elementui实现动态表单组件,通过拖拽组件到面板即可实现一个表单。支持各个组件的动态隐藏显示,动态表格弹窗式维护。致力打造开源最强vue动态表单组件,持续维护。 - jxh-0514/ng-form-element
基于vue和element-ui实现的表单设计器。通过拖拽方式快速生成一个表单页面,表单可以导出json格式,也可以将其他人绘制的表单通过json导入方式进行还原。 和其他开源表单的差异 每个组件可以动态隐藏和显示,并且提供除了“必填”以外的多种规则验证,支持表达式验证和正则验证 ...