react的antd中Cascader级联选择如何回显

news2025/2/7 17:30:35

如果你的数据都是这个样子的

{
    "id": 1015,
    "pid": 0,
    "name": "电力、热力、燃气及水生产和供应业",
    "children": [
        {
            "id": 1403,
            "pid": 1015,
            "name": "热力",
        },
        {
            "id": 1404,
            "pid": 1015,
            "name": "燃气以及生产供应业",
        },
        {
            "id": 1513,
            "pid": 1015,
            "name": "电力",
        }
    ],
}

这个时候你需要把他们修改一下为其添加value属性和lable属性,value对应id,lable对应name,因为组件只识别value和lable

   const data = res.data.data;
   // 对数组中的每个元素进行处理
   data.forEach((item: any) => addValueLabel(item));

   setIndustry(data);
// 遍历数据并添加 value 和 label
   function addValueLabel(item: { value: any; id: any; label: any; name: any; children: any[]; }) {
     // 给当前项加上 value 和 label
     item.value = item.id;
     item.label = item.name;

     // 如果有子项,递归添加
    if (item.children && Array.isArray(item.children)) {
    item.children.forEach((child: any) => addValueLabel(child));
    }
 }

然后使用form方法进行回显,写上对应的id就可以了

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2294397.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

深度学习系列--04.梯度下降以及其他优化器

目录 一.梯度概念 1.一元函数 2.二元函数 3.几何意义上的区别 二.梯度下降 1.原理 2.步骤 3.示例代码(Python) 4.不同类型的梯度下降 5.优缺点 三.动量优化器(Momentum) 适用场景 1.复杂地形的优化问题 2.数据具有噪声的问…

【C语言篇】“三子棋”

一、游戏介绍 三子棋,英文名为 Tic - Tac - Toe,是一款简单而经典的棋类游戏。游戏在一个 33 的棋盘上进行,两名玩家轮流在棋盘的空位上放置自己的棋子(通常用 * 和 # 表示),率先在横、竖或斜方向上连成三个…

TongSearch3.0.4.0安装和使用指引(by lqw)

文章目录 安装准备手册说明支持的数据类型安装控制台安装单节点(如需集群请跳过这一节)解压和启动开启X-Pack Security和生成p12证书(之后配置内置密码和ssl要用到)配置内置用户密码配置ssl(先配置内置用户密码再配ssl)配置控制台…

在本地顺利的部署一个al模型从零开始 windows

引言 (踩的坑,省流引言的内容没有有使模型跑起来) 最近想在本地部署一个deepseek模型,就在网上搞了3 4天终于是能够部署下来了,在部署的时候也是成功的踩了无数的坑,比如我先问al如何在本地部署一个语言模…

【容器技术01】使用 busybox 构建 Mini Linux FS

使用 busybox 构建 Mini Linux FS 构建目标 在 Linux 文件系统下构建一个 Mini 的文件系统,构建目标如下: minilinux ├── bin │ ├── ls │ ├── top │ ├── ps │ ├── sh │ └── … ├── dev ├── etc │ ├── g…

尝试在Excel里调用硅基流动上的免费大语言模型

我个人觉得通过api而不是直接浏览器客户端聊天调用大语言模型是使用人工智能大模型的一个相对进阶的阶段。 于是就尝试了一下。我用的是老师木 袁进辉博士新创的硅基流动云上的免费的大模型。——虽然自己获赠了不少免费token,但测试阶段用不上。 具体步骤如下&am…

SqlSugar简单使用之Nuget包封装-Easy.SqlSugar.Core

SqlSugar官方文档 Nuget包开源地址 Nuget包是为了简化SqlSugar的使用步骤,增加一些基础的使用封装 引入分为两个版本,一个Ioc模式,另一个是注入模式,如果不想影响原本的仓储代码推荐使用Ioc模式,两者区别不到,方法通…

Linux网络 | 理解NATPT, 数据链路层Done

前言:本节内容结束数据链路层, 本节的重要内容有两个:一个是见一个综合性面试题,另一个就是NAT技术NATPT。 那么废话不多说, 开始我们的学习吧!!! ps:最好先看一下上一篇…

微信小程序~django Petting pets(爱抚宠物)小程序

博主介绍:✌程序猿徐师兄、8年大厂程序员经历。全网粉丝15w、csdn博客专家、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌ 🍅文末获取源码联系🍅 👇🏻 精彩专栏推荐订阅👇…

UE (标识符, meta=())笔记

视频连接: [UFSH2024]UE5(标识符, meta(详解, 史上最全)) | 大钊 Epic Games 虚幻社区经理 参考文档: UE5标识符详解 | 史上最全 UnrealSpecifiers | UE5标识符详解 GitHub 老外整理的标识符文档 标识符 CPP_Default_ParamName(18:22&a…

并发编程 引用类型 原子类 Stamped和Markable atomicMarkableReference表单Ref和标记Markable 面试题

目录 Stamped 和 Markable 的区别 示例代码 所以这个东西是一次性的 从来没听说过 从来没见过 Stamped 和 Markable 的区别 标记号 boolean 一次性的 版本号 整型数 不建议用 Markable 解决 ABA 问题 AtomicMarkableReference 是一个位于 java.util.concurrent.atomic 包中…

绿联NAS安装cpolar内网穿透工具实现无公网IP远程访问教程

文章目录 前言1. 开启ssh服务2. ssh连接3. 安装cpolar内网穿透4. 配置绿联NAS公网地址 前言 本文主要介绍如何在绿联NAS中使用ssh远程连接后,使用一行代码快速安装cpolar内网穿透工具,轻松实现随时随地远程访问本地内网中的绿联NAS,无需公网…

【Ubuntu】ARM交叉编译开发环境解决“没有那个文件或目录”问题

【Ubuntu】ARM交叉编译开发环境解决“没有那个文件或目录”问题 零、起因 最近在使用Ubuntu虚拟机编译ARM程序,解压ARM的GCC后想要启动,报“没有那个文件或目录”,但是文件确实存在,环境配置也检查过了没问题,本文记…

微信小程序~电器维修系统小程序

博主介绍:✌程序猿徐师兄、8年大厂程序员经历。全网粉丝15w、csdn博客专家、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌ 🍅文末获取源码联系🍅 👇🏻 精彩专栏推荐订阅👇…

android 适配 api 35(android 15) 遇到的问题

首先升级 targetSdkVersion 和 compileSdkVersion 到 35,升级后发生的报错 一、 解决方案: 升级 gradle 和 gradle 插件版本 com.android.tools.build:gradle -> 8.3.0-alpha02 gradle-wrapper.properties : distributionUrl -> gradle-8.6-bin.zip htt…

Python Pandas(3):DataFrame

1 介绍 DataFrame 是 Pandas 中的另一个核心数据结构,类似于一个二维的表格或数据库中的数据表。它含有一组有序的列,每列可以是不同的值类型(数值、字符串、布尔型值)。DataFrame 既有行索引也有列索引,它可以被看做由…

Mac电脑上好用的压缩软件

在Mac电脑上,有许多优秀的压缩软件可供选择,这些软件不仅支持多种压缩格式,还提供了便捷的操作体验和强大的功能。以下是几款被广泛推荐的压缩软件: BetterZip 功能特点:BetterZip 是一款功能强大的压缩和解压缩工具&a…

BUUCTF_XSS-Lab

xss XSS(Cross - Site Scripting)即跨站脚本攻击,是一种常见的 Web 安全漏洞。攻击者通过在目标网站注入恶意脚本(通常是 JavaScript),当其他用户访问该网站时,这些恶意脚本会在用户的浏览器中执…

新能源算力战争:为什么AI大模型需要绿色数据中心?

新能源算力战争:为什么AI大模型需要绿色数据中心? 近年来,人工智能(AI)大模型的爆发式增长正在重塑全球科技产业的格局。以GPT-4、Gemini、Llama等为代表的千亿参数级模型,不仅需要海量数据训练,更依赖庞大的算力支撑。然而,这种算力的背后隐藏着一个日益严峻的挑战——…

go gin配置air

一、依赖下载 安装最新,且在你工作区下进行安装,我的是D:/GO是我的工作区,所有项目都在目录下的src, go install github.com/air-verse/airlatest 如果出现类似报错: 将图中第三行 github.com/air-verse/air 替换最…