layui扩展之 authtree 无限级权限控制树 authtree

感谢layui社区,及无限极权限控制树的作者。

首先下载authtree.js,为了你能正确使用该模块,建议放在extends文件夹下(没有就创建一个),该文件夹与layui同级,为了方便你的使用,第三方组件都可放在里面

配置该组件

layui.config({
    base: '域名/extends/',
}).extend({
    authtree: 'authtree',
});

前端的就不多说了,无限极权限控制树写的很清楚

主要讲接口的规则

layui扩展之 authtree 无限级权限控制树 authtree_第1张图片

code和msg就不说了,主要说data。data里面主要的两个属性(后台的键值)“list”和“checkedId”,list是树状数组,后台可以通过递归生成,checkedId可以通过修改的角色名得到,添加角色时,checkedId为空

要注意的是:

layui扩展之 authtree 无限级权限控制树 authtree_第2张图片

这里的规则,主要有name,value,checked,list。list实际就是子级,先查询出的权限表二维数组,在

layui扩展之 authtree 无限级权限控制树 authtree_第3张图片

遍历权限数组,如果id在checkedId中,则新增checked键值=>true,否则为false,另外value键值查询的时候自己看着办吧

在将得到的数组用递归转换成树状数组

layui扩展之 authtree 无限级权限控制树 authtree_第4张图片

默认返回json

 

你可能感兴趣的:(Layui,开发心得)