当前位置: 首页 > news >正文

react输入框检索树形(tree)结构

input搜索框搜索树形子级内容1. input框输入搜索内容2. 获取tree结构数据3. 与tree匹配输入的内容,tree是多维数组,一级一级的对比输入的内容是否匹配,用forEach循环遍历数据,匹配不到在往下找,直到找到为null ,返回

在这里插入图片描述
在这里插入图片描述

//tree子级
const childSerch = (res: any, val: any) => {res?.map((itemChilf: { meterName: any }, index) => {if (itemChilf?.meterName === val) {dataName.push(itemChilf);return dataName;} else {itemChilf?.children?.map((itemChilf1: { meterName: any }) => {if (itemChilf1.meterName === val) {dataName.push(itemChilf);return dataName;}return childSerch(itemChilf1?.children, val);});return dataName;}});return dataName;};const fetchDeptList = async (val: any) => {try {dataName = [];//获取tree列表await getDeptTree().then((res: any) => {//判断是输入的那个值if (val?.formType.energyMediumId != undefined) {console.log(123456);let data: any[] = [];//循环treeres.forEach((element: any) => {if (element.id === val.formType.energyMediumId) {data.push(element);if (val?.formType?.meterName) {data = childSerch(element.children, val?.formType.meterName);}}});console.log(data);setTreeData(data);exKeys.push(data[0].children[0].id);setExpandedKeys(exKeys);props.onSelect(data[0].children[0]);return;} else if (val?.formType.meterName != undefined) {let data = [];data = childSerch(res, val?.formType.meterName);setTreeData(data);exKeys.push(data[0].children[0].id);setExpandedKeys(exKeys);props.onSelect(data[0].children[0]);return;}// console.log(val.formType.energyMediumId)setTreeData(res);// renderTreeNodes(res[0]);exKeys.push(res[0].children[0].id);setExpandedKeys(exKeys);props.onSelect(res[0].children[0]);});// hide();return true;} catch (error) {// hide();return false;}};

相关文章:

react输入框检索树形(tree)结构

input搜索框搜索树形子级内容1. input框输入搜索内容2. 获取tree结构数据3. 与tree匹配输入的内容,tree是多维数组,一级一级的对比输入的内容是否匹配,用forEach循环遍历数据,匹配不到在往下找,直到找到为null &#x…...

云原生学习系列之基础环境准备(虚拟机搭建)

最近由于工作需要开始学习云原生相关内容,为方便学习操作,准备在外网搭建自己的环境,然后进行相关的练习,搭建环境的第一步便是虚拟机的安装。 基础软件 这里我用到的是CentOS-7-x86_64的操作系统。 链接:https://pa…...

Python入门知识点分享——(十三)内置函数

先向大家致歉,这几天忙于单片机的复习和考试,耽误了Python知识的分享。今天在回顾的时候发现数据计算还有些遗漏的部分,基本上都属于Python的内置函数,就一并补充在这篇文章中。 Python内置函数是在Python解释器中已经预定义的函…...

手拉手springboot3整合mybatis-plus多数据源

环境介绍 技术栈 springbootmybatis-plusmysql 软件 版本 mysql 8 IDEA IntelliJ IDEA 2022.2.1 JDK 17 Spring Boot 3.1.7 dynamic-datasource 3.6.1 mybatis-plus 3.5.3.2 加入依赖 <dependency><groupId>com.baomidou</groupId><arti…...

【JAVA】Java8开始ConcurrentHashMap,为什么舍弃分段锁

&#x1f34e;个人博客&#xff1a;个人主页 &#x1f3c6;个人专栏&#xff1a; JAVA ⛳️ 功不唐捐&#xff0c;玉汝于成 目录 前言 正文 分段锁的好处&#xff1a; 结语 我的其他博客 前言 在Java 8中&#xff0c;ConcurrentHashMap的实现经历了重大的改进&am…...

基于JAVA+SpringBoot的咖啡商城

✌全网粉丝20W,csdn特邀作者、博客专家、CSDN新星计划导师、java领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌ &#x1f345;文末获取项目下载方式&#x1f345; 一、项目背景介绍&#xff1a; 随着互联网的普及和发…...

[AutoSar]基础部分 RTE 08 runnable mapping

目录 关键词平台说明一、runnable mapping的必要性二、runnable mapping 通用规则三、Task type四、可以不用mapping的runnbale 关键词 嵌入式、C语言、autosar、runnable 平台说明 项目ValueOSautosar OSautosar厂商vector芯片厂商TI编程语言C&#xff0c;C编译器HighTec (…...

云消息队列 Kafka 版生态谈第一期:无代码转储能力介绍

作者&#xff1a;娜米 云消息队列 Kafka 版为什么需要做无代码转储 云消息队列 Kafka 版本身是一个分布式流处理平台&#xff0c;具有高吞吐量、低延迟和可扩展性等特性。它被广泛应用于实时数据处理和流式数据传输的场景。然而&#xff0c;为了将云消息队列 Kafka 版与其他数…...

java: 从HBase中读取数据

一、添加依赖&#xff1a; <dependency><groupId>org.apache.hadoop</groupId><artifactId>hadoop-client</artifactId><version>2.6.0</version></dependency><dependency><groupId>org.apache.hbase</groupI…...

Lumeical Script------Script Prompt 中的两种输出方式

Lumeical Script------Script Prompt 中的两种输出方式 引言正文方法1方法2 引言 有时候&#xff0c;和众多编程语言一样&#xff0c;我们需要在 Script Prompt 中打印一些我们已经得到的数据&#xff0c;这样可以方便我们调试代码和查看代码中是否有错误。关于在 Script Prom…...

什么是OOM error

OOM error是"Out of Memory"&#xff08;内存不足&#xff09;错误的简称。它通常发生在计算机程序执行过程中&#xff0c;当程序需要更多内存空间来执行操作&#xff0c;但系统没有足够的可用内存时&#xff0c;就会触发OOM错误。 当程序尝试使用超过其可用内存的量…...

IO进程线程 day7

使用消息队列完成两个进程之间相互通信 #include<my_head.h> struct msgbuf {long mtype;char mtext[128]; }; #define SIZE (sizeof(struct msgbuf) - sizeof(long))//分支线程从消息队列中读取类型2的消息 void *task(void *arg) {int msgid *((int *)arg);struct msg…...

扩展学习|数据融合助推商务智能与分析

文献来源&#xff1a;[1]李爱华,续维佳,石勇.基于数据融合的商务智能与分析架构研究[J].计算机科学,2022,49(12):185-194. 一、信息融合 &#xff08;一&#xff09;信息融合定义演变 早期信息融合的定义指出&#xff0c;其主要任务是综合分析若干传感器观测到的信息[9,…...

Java项目:112SSM在线电影订票系统

博主主页&#xff1a;Java旅途 简介&#xff1a;分享计算机知识、学习路线、系统源码及教程 文末获取源码 一、项目介绍 在线电影订票系统基于SpringSpringMVCMybatis开发&#xff0c;系统分为前台和后台&#xff0c;前台主要用来用户浏览电影信息&#xff0c;订票&#xff0c…...

Echarts——使用graphic组件在一个option内同时设置两个饼图的背景图

使用echarts的graphic原生图形元素组件&#xff0c;为两个饼图设置对应背景。 <template><div id"app"><div class"charts" ref"charts"></div></div> </template><script> import * as echarts from…...

编程笔记 html5cssjs 027 HTML输入属性(1/2)

[TOC](编程笔记 html5&css&js 027 HTML输入属性(1/2)) <input>元素除了type属性表示输入类型&#xff0c;后面还跟上其他属性&#xff0c;叫输入属性。 value 属性 value 属性规定输入字段的初始值&#xff1a; <form action"">First name:<…...

请求参数乱码问题

POST请求方式解决乱码问题 在web.xml里面设置编码过滤器 <filter><filter-name>CharacterEncodingFilter</filter-name><filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class><!-- 设置过滤器中的属性值 -…...

【leetcode】力扣热门之反转链表【简单难度】

题目描述 给你单链表的头节点 head &#xff0c;请你反转链表&#xff0c;并返回反转后的链表。 用例 输入&#xff1a;head [1,2,3,4,5] 输出&#xff1a;[5,4,3,2,1] 输入&#xff1a;head [1,2] 输出&#xff1a;[2,1] 输入&#xff1a;head [] 输出&#xff1a;[…...

【sgPasswordInput】自定义组件:带前端校验密码强度的密码输入框,能够提供密码强度颜色提示和文字提示

特性&#xff1a; 有密码强度颜色提示密码强度进度条提示支持设置默认输入提示和密码长度 sgPasswordInput源码 <template><div :class"$options.name" style"width: 100%"><el-inputstyle"width: 100%"ref"psw"type&…...

1599 - Ideal Path (UVA)

题目链接如下&#xff1a; https://onlinejudge.org/index.php?optioncom_onlinejudge&Itemid8&category448&pageshow_problem&problem4474 这道题也是看了刘汝佳的思路才写出来的.... 代码如下&#xff1a; #include <cstdio> #include <deque&…...

计算机网络(超级详细笔记)

使用教材计算机网络&#xff08;第8版&#xff09;&#xff08;谢希仁&#xff09; 第一章&#xff1a;概述 第二章&#xff1a;物理层 第三章&#xff1a;数据链路层 第四章&#xff1a;网络层 第五章&#xff1a;运输层 第六章&#xff1a;应用层 目…...

老杨说运维 | 年末大讲回顾:运维的尽头也是大模型吗?

哈喽~朋友们&#xff0c;这么快又见面啦。前阵子我们给CEO老杨安排了一场年末大讲&#xff0c;主要是跟大家聊聊智能运维的“智”与“能”以及剖析时下热点----运维大模型。后台收到了不少朋友的反馈&#xff0c;小编看了大受鼓舞并暗下决心----新的一年&#xff0c;希望能多安…...

Unity 利用UGUI之Scrollbar制作进度条

在Unity中除了用Slider、Image做进度条&#xff0c;其实用Scrollbar也可以做进度条。 首先&#xff0c;在场景中新建一个Scrollbar组件和一个Text组件&#xff1a; 其次&#xff0c;创建模拟进度的一个脚本&#xff0c;Scrollbar_Progressbar.cs: using System.Collections; …...

MySQL之导入、导出

文章目录 1.navicat导入导出2.mysqldump命令导入导出2.1导出2.2导入 3.load data infile命令导入导出4.远程备份5.思维导图 1.navicat导入导出 使用Navicat工具导入t_log 共耗时 55s 2.mysqldump命令导入导出 2.1导出 导出表数据和表结构 语法&#xff1a; mysqldump -u用…...

【unity小技巧】FPS游戏实现相机的偏移震动、武器射击后退和后坐力效果

最终效果 文章目录 最终效果前言相机偏移震动相机震动脚本换弹节点震动 武器射击后退效果武器后坐力效果完结 前言 关于后坐力之前其实已经分享了一个&#xff1a;FPS游戏后坐力制作思路 但是实现起来比较复杂&#xff0c;如果你只是想要简单的实现&#xff0c;可以看看这个&…...

MINCO+汽车

规划典型的解决方法: 如何准确的描述他的动力学,实际上是对这个物理对象进行建模.(规划等于开环的控制,控制等于闭环的规划),规划系统要做到是假设已知系统模型的情况下去计算一些可能会影响比较好的 未来运动的指令,做未来运动轨迹的推演.对自己建模的情况下还需对环境有个比较…...

大模型机器人发展史:从VoxPoser、RT2到斯坦福Mobile ALOHA、Google机器人

前言 23年7月&#xff0c;我在朋友圈评估Google的RT2说道&#xff1a; “大模型正在革新一切领域啊&#xff0c;超帅&#xff0c;通过大模型不仅能理解“人话”&#xff0c;还能对“人话”进行推理&#xff0c;并转变为机器人能理解的指令&#xff0c;从而分阶段完成任务。回…...

Ubunutu18.04 ROS melodic 无人机 XTDrone PX4 Vins-Fuison 运行配置

一、PX4飞控EKF配置 PX4默认使用的EKF配置为融合GPS的水平位置与气压计高度。如果我们想使用视觉定位&#xff0c;就需要把修改配置文件。让EKF融合来自mavros/vision_pose/pose的数据 1.1修改rcS配置文件 gedit ~/PX4_Firmware/ROMFS/px4fmu_common/init.d-posix/rcS 通过注…...

Linux 常见服务配置

笔记所以内容很多&#xff0c;建议选择性看看 SSH Secure Shell 用于与服务器建立安全的连接 对应服务 sshd 注意&#xff1a;配置文件 配制文件修改需要重启或重载sshd服务才能生效 systemctl sshd reload # 重载 sshd 配置文件 systemctl sshd restart # 重启 ssh…...

Flutter基础

一、关键字 class&#xff1a;用于定义一个新的类&#xff1b; extends: 用于指定一个类继承另一个类&#xff1b; mixin: 用于将一个类的代码片段添加到另一个类中&#xff0c;实现代码复用&#xff1b; abstract: 用于声明一个抽象类或抽象方法&#xff0c;不能直接实例化&a…...

wordpress怎么安装asp主题/上海培训机构排名榜

sView.getHolder().setFixedSize(fitYSize.x, fitYSize.y);...

做资料网站违法/网站备案

lsof -i tcp:port eg: lsof -i tcp:8899 转载于:https://www.cnblogs.com/itdev/p/6379519.html...

做多语言版本网站/培训网站有哪些

目录 一、Object类型的概述 二、Object类的构造方法 三、Object类的常见方法 1、hashCode方法 2、toString方法 3、equals方法 四、 和 equals 方法的区别 一、Object类型的概述 Object类是所有类型的顶层父类&#xff0c;所有类型的直接或者间接的父类&#xff1b;所有…...

长网址转短网址网站/百度合伙人答题兼职赚钱

作者 | 追一科技AI Lab 研究员 苏剑林前言▲“鸡兔同笼”的那些年“盈亏问题”、“年龄问题”、“植树问题”、“牛吃草问题”、“利润问题”...&#xff0c;小学阶段你是否曾被各种花样的数学应用题折磨过呢&#xff1f;没关系&#xff0c;现在机器学习模型也可以帮助我们去解…...

湛江本地做网站/论坛seo教程

1.七年级&#xff08;2&#xff09;班的学生特别喜欢数学老师王老师&#xff0c;都觉得她是一个好老师&#xff0c;因为王老师说话很好听&#xff0c;不管她说什么大家都觉得是好的。这种现象属于&#xff08;&#xff09;。 A.投射效应 B.晕轮效应 C.皮格马利翁效应 D.首因效…...

一个ip地址上可以做几个网站/360站长平台链接提交

最近抖音上流行用程序去和喜欢的小姐姐表白&#xff0c;所以&#xff0c;我也用python做了一个这样的图形化界面的小程序。 Github&#xff1a;gitgithub.com:wangqujie/xjj.git 准备工作&#xff1a; 1、首先确定自己的电脑上安装了python3&#xff0c;如未安装&#xff0c;请…...