react的antd表格数据回显在form表单中

news/2025/2/9 0:49:03 标签: javascript, 前端, css, react.js

1、首先为table添加编辑按钮
 

javascript"> {
      title: '操作',
      align: 'center',
      render: (_: any, record: any) => (
        <div style={
  
  { display: 'flex', alignItems: 'center', justifyContent: 'space-evenly' }}>
          <Button
            size="small"
            onClick={() => deitor(record)}  
            style={
  
  { marginRight: '10px', backgroundColor: '#F3F9FF' }}
            color="primary"
            variant="outlined"
            icon={<EditFilled />}
          >
            编辑
          </Button>
        </div>
      ),
    },

2、然后在用函数接过来数据,使用form.setFieldsValue({})进行回显

function deitor(item: any) {
form.setFieldsValue({
        id: item.id,
        content: item.content,
        name: item.name,
      });
}


http://www.niftyadmin.cn/n/5845403.html

相关文章

备战蓝桥杯:二进制枚举之子集问题

78. 子集 - 力扣&#xff08;LeetCode&#xff09; 利用二进制枚举的方式&#xff0c;把所有的情况都表示出来 比如我们测试用例是[1,2,3] 下标和值对应是 0-1 1-2 2-3 我们用0到7的二进制就能把所有情况枚举出来 0:0000 ---- 表示三个元素都不选 [] 1:0001-----表示只…

【使用小技巧】git rebase命令详解

Git Rebase命令介绍&#xff1a;场景与实例详解 在Git版本控制系统中&#xff0c;git rebase是一个强大且实用的命令&#xff0c;它用于重新整理提交历史&#xff0c;使提交记录更加线性和清晰。本文将通过具体场景和实际例子&#xff0c;详细介绍git rebase命令的使用方法和效…

【合集】Java进阶——Java深入学习的笔记汇总 amp; 再论面向对象、数据结构和算法、JVM底层、多线程

前言 spring作为主流的 Java Web 开发的开源框架&#xff0c;是Java 世界最为成功的框架&#xff0c;持续不断深入认识spring框架是Java程序员不变的追求&#xff1b;而spring的底层其实就是Java&#xff0c;因此&#xff0c;深入学习Spring和深入学习Java是硬币的正反面&…

Websocket从原理到实战

引言 WebSocket 是一种在单个 TCP 连接上进行全双工通信的网络协议&#xff0c;它使得客户端和服务器之间能够进行实时、双向的通信&#xff0c;既然是通信协议一定要从发展历史到协议内容到应用场景最后到实战全方位了解 发展历史 WebSocket 最初是为了解决 HTTP 协议在实时…

8. k8s二进制集群之Kubectl部署

创建kubectl证书请求文件生成admin证书文件复制admin证书到指定目录生成kubeconfig配置文件接下来完成kubectl配置文件的角色绑定【扩展】kubectl命令补全操作继续上一篇文章《k8s二进制集群之Kube ApiServer部署》下面介绍一下k8s中的命令行管理工具kubectl。 通过kubectl可以…

PbootCMS 修改跳转提示,修改笑脸时间

在使用时&#xff0c;每次都提示这个&#xff1a; 修改方法&#xff1a; 修改跳转时间&#xff1a;找到 handle.php 文件编辑 &#xff0c;调整 setTimeout 函数的时间参数。 修改提示文字&#xff1a;编辑 handle.php 文件&#xff0c;修改提示文字的内容。 隐藏提示页面&am…

RK3568平台开发系列讲解(ConfigFS篇)ConfigFS核心数据结构

🚀返回专栏总目录 文章目录 一、数据结构二、结构体关系三、案例3.1、configfs_subsystem 实例3.2、config_group 实例化四、属性和方法五、config_item实例化沉淀、分享、成长,让自己和他人都能有所收获!😄 理解 ConfigFS 的核心数据结构对于深入使用和定制 ConfigFS 非…

深度学习入门:搭建你的第一个神经网络

在当今数字化时代,深度学习正以前所未有的速度改变着我们的生活。从语音助手到自动驾驶汽车,从图像识别到自然语言处理,深度学习的应用无处不在。而Python作为一门简洁而强大的编程语言,成为了深度学习领域最受欢迎的工具之一。今天,我们将一起踏上深度学习的旅程,搭建你…