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

React +AntD + From组件重复提交数据(已解决)

开发场景:

react +Hooks +andt

提交form表单内容给数据库(使用antd的form组件)


问题描述

提交是异步的,请提交方式是POST 方式

提交表单内容给后端,却产生了两次提交记录(当然,数据新增了两条数据)。可以理解是重复提交(2次),核心代码如下:

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

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


原因分析:

一开始去找解决方案,误以为是没做防抖和节流的缘故,方向错了,问题肯定不好解决,后端也尝试了休眠3秒,有效,但是吧,,,。
因为提交方式是POST ,想到了POST 会发送两次请求(当发送带有自定义请求头的 POST 请求时,浏览器会先发送一个 OPTIONS 请求进行预检,如果服务器允许该请求,则浏览器会再次发送实际的 POST 请求。这就是为什么有时候会看到 POST 请求被发送了两次的情况。),但这也不是原因
最后肯定不理想,还白白浪费了时间,


解决方案:

htmlType="submit"导致的。删除,,

看一下修改之前的:
在这里插入图片描述
修改之后的:
在这里插入图片描述

会发现少了htmlType=“submit” ,(htmlType=“submit” 默认情况下,点击后会执行提交form表单的动作。)
那Button 里面还有一个onClick(form.submit),也是表单提交。所以会提交两次,
真的是大意了,

相关文章:

React +AntD + From组件重复提交数据(已解决)

开发场景: react Hooks andt 提交form表单内容给数据库(使用antd的form组件) 问题描述 提交是异步的,请提交方式是POST 方式 提交表单内容给后端,却产生了两次提交记录(当然,数据新增了两条数据)。可以…...

spring的简单使用(配合Druid操作数据库)

文章目录 准备数据pom.xml文件中引用需要的库准备好dao层接口和service层接口和实现类准备好 jdbc.properties 和 user.properties编写Druid的jdbcConfig配置类编写spring的配置类SpringConfig编写Dao层的实现类的逻辑测试类参考文献 准备数据 create database if not exists …...

10.20作业

#include “widget.h” #include “ui_widget.h” Widget::Widget(QWidget *parent) QWidget(parent) , ui(new Ui::Widget) { ui->setupUi(this); t new QTimer(this); connect(t, &QTimer::timeout, this, &Widget::timeout_Slot); ui->text->setPlacehold…...

笔记1 Compute Shaders

Wending 2022/10/29 15:43:54 Compute Shaders是在GPU运行却又在普通渲染管线之外的程序,通过Compute Shader我们可以将大量可以并行的计算放到GPU中计算从而节省CPU资源 Wending 2022/10/29 15:44:27 反正不是传统的shader 不常用 博毅创为Blake老师 2022/10/29 15…...

IntelliJ IDEA 2023版本 Debug 时没有Force Step Into 按钮解决方法

IntelliJ IDEA 2023版本 Debug 时没有Force Step Into 按钮解决方法 force step into作用是能够去查看原码, 新版本idea默认移除了这个按钮😢 那么让我们来把它找出来叭✋ 但是我们可以通过设置,使用step into就可以进入系统方法。 1.单击…...

【2024秋招】用友后端BIP部门hr面-2023.8.31

反思 首先,我想为你提供一个背景:HR面试不仅仅是为了了解你的背景和经验,还包括你的性格、沟通能力、问题解决技巧、团队合作精神和其他软性技能。基于你提供的信息,我会提供一些可能影响offer级别的点: 答案的质量&a…...

[ Windows ] ping IP + Port 测试 ip 和 端口是否通畅

开发过程中经常会黑窗口中手动测试一下计划请求的目标ip和端口是否通畅,测试方式如下: 一、单纯测试ip是否能够 ping 通,这个比较熟悉了,运行 cmd 打开黑窗口 输入如下指令,能够如下提示信息,表示端口是通…...

Golang协程的概念、用法、场景及案例

在当今的软件开发领域中,高性能和并发性是很重要的。开发人员需要编写能够有效利用多核处理器的程序,以提高应用程序的性能和响应能力。Go语言(Golang)就是一种在这方面非常强大的编程语言,它提供了一种称为协程&#…...

Redis 主从复制,哨兵,集群——(3)集群篇

目录 1. 前篇回顾 2. Redis 集群是什么? 3. Redis 集群的优点 4. Redis 集群的槽位概念 5. 什么是分片? 6. 如何找到给定key的分片? 7. 分片槽位的设计有什么好处? 8. key映射到节点的三种解决方案 8.1 哈希取余分区 8.…...

Flink之Watermark水印、水位线

Watermark水印、水位线 水位线概述水印本质生成WatermarkWatermark策略WatermarkStrategy工具类使用Watermark策略 内置Watermark生成器单调递增时间戳分配器固定延迟的时间戳分配器 自定义WatermarkGenerator周期性Watermark生成器标记Watermark生成器Watermark策略与Kafka连接…...

uni-app:对数组对象进行以具体某一项的分类处理

一、原始数据 这里定义为五个数组,种类product有aaa,bbb两种 原始数据在data中进行定义 res: {"success": true,"devices": [{no: 0,product: aaa,alias: "设备1",assign: [["a1", "a2", "a3"],[&q…...

顺序队列----数据结构

队列的概念 队列,符合先进先出特点的一种数据结构,是一种特殊的线性表,但它不像线性表一样可以任意插入和删除操作,而是只允许在表的一端插入,也就是在队列的尾部进行插入;只允许在表的另一端进行删除&…...

【Python学习笔记】字符串格式化

1. printf 风格 这种格式化语法 和 传统的C语言printf函数 一样 。 salary input(请输入薪资:)# 计算出缴税额,存入变量tax tax int(salary) *25/100 # 计算出税后工资,存入变量aftertax aftertax int(salary) *75/100 print(税前薪资&…...

RIP,EIGRP,OSPF区别

1. 动态路由协议的作用是什么? 2. 路由协议都有哪些种类? 3. 如何判断路由协议的优劣? -- RIP,EIGRP,OSPF - 动态路由协议 -- 路由协议 - 路由器上的软件 -- 帮助路由器彼此之间同步路由表 -- 相互的传递…...

驱动day2作业

编写应用程序控制三盏灯亮灭 head.h #ifndef __HEAD_H__ #define __HEAD_H__ #define PHY_LED1_MODER 0x50006000 #define PHY_LED2_MODER 0x50007000 #define PHY_LED1_ODR 0x50006014 #define PHY_LED2_ODR 0x50007014 #define PHY_RCC 0x50000A28#endif demo1.c #includ…...

MySQL基本操作之创建数据表

设计表: 学生表(Student): 学号(StudentID)- 主键,用于唯一标识每个学生姓名(Name)性别(Gender)年龄(Age)出生日期(BirthDate)地址(Address)电话(Phone)邮箱(Email)课程表(Course): 课程号(CourseID)- 主键,用于唯一标识每门课程课程名(CourseNam…...

rk平台android12修改dp和喇叭同时输出声音

客户的rk3588主板android12系统,要求接上type-c 进行dp输出显示以后,dp端和主板端都有声音。rk原有系统默认是接上dp显示以后,主板的喇叭声音会被切掉,导致没有声音。要让喇叭和dp同时输出声音需要做如下修改: --- a/…...

经典网络模型

Alexnet VGG VGG的启示 VGGNet采用了多次堆叠3x3的卷积核,这样做的目的是减少参数的数量。 例如,2个3x3的卷积核效果相当于1个5x5的卷积核效果,因为它们的感受野(输入图像上映射区域的大小)相同。但2个3x3卷积核的参数…...

SystemVerilog Assertions应用指南 Chapter1.29“ disable iff构造

在某些设计情况中,如果一些条件为真,则我们不想执行检验。换句话说,这就像是一个异步的复位,使得检验在当前时刻不工作。SVA提供了关键词“ disable iff来实现这种检验器的异步复位。“ disable iff”的基本语法如下。 disable iff (expression) <property definition> …...

C++设计模式之MVC

MVC&#xff08;Model-View-Controller&#xff09;是一种经典的软件架构模式&#xff0c;用于组织和分离应用程序的不同部分&#xff0c;以提高代码的可维护性、可扩展性和重用性。MVC模式将应用程序分为三个主要组成部分&#xff1a; Model&#xff08;模型&#xff09;&…...

Java 语言特性(面试系列2)

一、SQL 基础 1. 复杂查询 &#xff08;1&#xff09;连接查询&#xff08;JOIN&#xff09; 内连接&#xff08;INNER JOIN&#xff09;&#xff1a;返回两表匹配的记录。 SELECT e.name, d.dept_name FROM employees e INNER JOIN departments d ON e.dept_id d.dept_id; 左…...

docker详细操作--未完待续

docker介绍 docker官网: Docker&#xff1a;加速容器应用程序开发 harbor官网&#xff1a;Harbor - Harbor 中文 使用docker加速器: Docker镜像极速下载服务 - 毫秒镜像 是什么 Docker 是一种开源的容器化平台&#xff0c;用于将应用程序及其依赖项&#xff08;如库、运行时环…...

AI Agent与Agentic AI:原理、应用、挑战与未来展望

文章目录 一、引言二、AI Agent与Agentic AI的兴起2.1 技术契机与生态成熟2.2 Agent的定义与特征2.3 Agent的发展历程 三、AI Agent的核心技术栈解密3.1 感知模块代码示例&#xff1a;使用Python和OpenCV进行图像识别 3.2 认知与决策模块代码示例&#xff1a;使用OpenAI GPT-3进…...

Oracle查询表空间大小

1 查询数据库中所有的表空间以及表空间所占空间的大小 SELECTtablespace_name,sum( bytes ) / 1024 / 1024 FROMdba_data_files GROUP BYtablespace_name; 2 Oracle查询表空间大小及每个表所占空间的大小 SELECTtablespace_name,file_id,file_name,round( bytes / ( 1024 …...

在rocky linux 9.5上在线安装 docker

前面是指南&#xff0c;后面是日志 sudo dnf config-manager --add-repo https://download.docker.com/linux/centos/docker-ce.repo sudo dnf install docker-ce docker-ce-cli containerd.io -y docker version sudo systemctl start docker sudo systemctl status docker …...

蓝牙 BLE 扫描面试题大全(2):进阶面试题与实战演练

前文覆盖了 BLE 扫描的基础概念与经典问题蓝牙 BLE 扫描面试题大全(1)&#xff1a;从基础到实战的深度解析-CSDN博客&#xff0c;但实际面试中&#xff0c;企业更关注候选人对复杂场景的应对能力&#xff08;如多设备并发扫描、低功耗与高发现率的平衡&#xff09;和前沿技术的…...

Java面试专项一-准备篇

一、企业简历筛选规则 一般企业的简历筛选流程&#xff1a;首先由HR先筛选一部分简历后&#xff0c;在将简历给到对应的项目负责人后再进行下一步的操作。 HR如何筛选简历 例如&#xff1a;Boss直聘&#xff08;招聘方平台&#xff09; 直接按照条件进行筛选 例如&#xff1a…...

Redis数据倾斜问题解决

Redis 数据倾斜问题解析与解决方案 什么是 Redis 数据倾斜 Redis 数据倾斜指的是在 Redis 集群中&#xff0c;部分节点存储的数据量或访问量远高于其他节点&#xff0c;导致这些节点负载过高&#xff0c;影响整体性能。 数据倾斜的主要表现 部分节点内存使用率远高于其他节…...

rnn判断string中第一次出现a的下标

# coding:utf8 import torch import torch.nn as nn import numpy as np import random import json""" 基于pytorch的网络编写 实现一个RNN网络完成多分类任务 判断字符 a 第一次出现在字符串中的位置 """class TorchModel(nn.Module):def __in…...

使用Matplotlib创建炫酷的3D散点图:数据可视化的新维度

文章目录 基础实现代码代码解析进阶技巧1. 自定义点的大小和颜色2. 添加图例和样式美化3. 真实数据应用示例实用技巧与注意事项完整示例(带样式)应用场景在数据科学和可视化领域,三维图形能为我们提供更丰富的数据洞察。本文将手把手教你如何使用Python的Matplotlib库创建引…...