首页 > 其他 > 详细

修改layui tree组件支持上移下移

时间:2020-05-15 18:26:56      阅读:394      评论:0      收藏:0      [点我收藏+]

layui版本:layui-v2.5.6 MIT

问题:简介好用的layui前端框架真是后端开发着的福音(手动点赞) ,有个新需求就是导航管理改成树形结果。layui的tree组件支持增,删,改,

技术分享图片

 

 

 

但是不支持上下移动。

要求新增和修改的时候页面不创建图标直接调用相应的节点回调函数。

这个自己如何改造下呢。

要求效果:

技术分享图片

 

 

解决:

我找到 html\lib\layui\lay\modules\tree.js 文件打开。

技术分享图片

 

 

 还好找了个工具 格式化下。

技术分享图片

 

 

 这样好看多了

去除编辑菜单的时候 编辑页面菜单文字的逻辑,直接处理操作节点的回调

技术分享图片

 

 

 

  然后增加上下移动的两个图标分别命名为moveup movedown

 

技术分享图片

 

 

 

在 update 函数逻辑后增加 moveup movedown 函数逻辑     

技术分享图片

 

 

 

tree.render配置中开启moveup movedown 回调操作

 

技术分享图片

 

 

 

重新加载页面试试

技术分享图片

 

 

 

当然,layui也是没有默认的上下箭头图标的,参考此文章增加icon layui 自定义字体图标 扩展

                                                                                                                                                                        

修改layui tree组件支持上移下移

原文:https://www.cnblogs.com/kala00k/p/12895393.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!