首页 > 其他分享 >使用Layui树形组件如何取值

使用Layui树形组件如何取值

时间:2023-04-20 16:45:36浏览次数:33  
标签:code level Layui tree ids showLevel 树形 treeElement 取值

近期使用了Layui中的树形组件来权限,发现无法没有提供直接获取选中值的id或code方法。 分享一下个人方法

官方案例

 可以使用 tree.getChecked('demoId') 获取选中的节点,选中节点是个JSON无法直接获取指定code或者id等信息,需要我们自己处理一下

 

本方法可以获取指定 层级的id或code等信息

核心代码

 /**  这里我获取的是树中code的信息
     * 
     * @param tree  选中的树结构节点
     * @param level 从第几层开始,默认1
     * @param showLevel 空只显示哪层数据,默认全部层级数据
     * @returns {string}
     */
function getCodes(tree,level,showLevel){
    if(tree == null){
        return "";
    }
    if(level == null){
        level = 1;
    }
    let ids = "";
    for (let i = 0; i < tree.length; i++) {
        let treeElement = tree[i];
        if(level == showLevel){
            ids += treeElement.code+",";
        }else if(showLevel == "all" || showLevel == null){
            ids += treeElement.code+",";
        }
        ids += getCodes(treeElement.children,(level+1),showLevel)
    }
    if(level == 1 && ids.length > 0){
        ids = ids.substring(0,ids.lastIndexOf(","))
    }
    return ids;
}

 

使用测试

分别到控制台输出:

  第一层code信息

  第二层code信息

  第三层code信息

  第四层code信息

  所有层code信息

 查看运行结果

 对应描述

 完!

 

标签:code,level,Layui,tree,ids,showLevel,树形,treeElement,取值
From: https://www.cnblogs.com/lccsdncnblogs/p/17337332.html

相关文章

  • 收藏 JSP自定义标签EL表达式取值问题
    给你个标签的例子自己看看吧!标签:<framework:VoucherCodeToNamecode=""/>tld.xml<tag><name>VoucherCodeToName</name><tagclass>com.itown.crm.fee.vouchermanager.util.VoucherCodeToNameTag</tagclass>&......
  • gitee github 左侧栏树形显示插件 Octotree codetree 浏览器插件
    起因看到一位仁兄用gitee做仓库https://gitee.com/zhengqingya/java-developer-document然后左侧栏挺方便(抖音视频)下载chrome扩展市场搜octotree用于githubcodetree用于gitee双核浏览器扩展市场搜octotree用于githubgitcodetree用于gitee......
  • 树形DP
    树形DP树形DP,即在树上进行的DP。由于树固有的递归性质,树形DP一般都是递归进行的。例题没有上司的舞会洛谷1352#include<bits/stdc++.h>usingnamespacestd;intn,i,x,y,b[6005],f[6005][2];vector<int>a[6005];voidsc(intx){ for(inti=0;i<a[x].size();i++) ......
  • Maven_Scope取值的含义
    maven依赖关系中Scope的作用 DependencyScope 在POM4中,<dependency>中还引入了<scope>,它主要管理依赖的部署。目前<scope>可以使用5个值: *compile,缺省值,适用于所有阶段,会随着项目一起发布。 *provided,类似compile,期望JDK、容器或使用者会提供这个依赖。如servlet.jar。 *......
  • [转载]php递归生成树形结构(几种常见的数据结构)
    版权声明:本文为CSDN博主「陈文焕」的原创文章,遵循CC4.0BY-SA版权协议,转载请附上原文出处链接及本声明。原文链接:https://blog.csdn.net/qq_23116221/article/details/109910846pid找上级id$array=array(array('id'=>1,'pid'=>0,'n'=>'河北省'),ar......
  • layui 框架收藏 - 前端篇
    1. layuimini     最简洁、清爽、易用的layui后台框架模板。layui页面的风格,分为iframe多tab版本和单页版。   主要特性界面足够简洁清爽,响应式且适配手机端。一个接口几行代码而已直接初始化整个框架,无需复杂操作。页面支持多配色方案,可自行选择喜欢的配色......
  • 请封装⼀个⽅法,将以下树形数据转换成期望的格式
    转化前constlist=[{id:1},{pid:1,id:2},{id:3},{pid:3,id:4},{pid:4,id:5}]转化后[{id:1,children:[{pid:1,id:2}]},{id:3,children:[{pid:3,id:4,children:[{pid:4,id:5}]}]}]getChildren(arr,id){constres=[];//根据数据⼀致性,定义返回的......
  • 康复训练の树形DP
    所有代码的开头头文件,宏定义和命名空间如下#include<bits/stdc++.h>#defineTptemplate<typenameTy>#defineTstemplate<typenameTy,typename...Ar>#definelllonglong#defineCIconstint#defineRIint#defineWwhile#definegcgetchar#definemax(x,y)......
  • el-table树形数据与懒加载
    <template><divclass="page"><divclass="page-box"><h3style="margin-top:0">类目/榜单管理</h3><el-inputplaceholder="请输入关键字"v-model="keyWord"style="......
  • clayui clayui使用配置
                  在使用CLAYUI前需要对您的工程做如下设置:DebugMultithreadedDLL或者MultithreadedDLL                      VC6下具体设置为:Project-Settings-C/C++,Category选择CodeGeneration,                   ......