React——点击事件函数调用问题

news/2024/9/21 14:43:27 标签: react.js, javascript, 前端

问题

<MessageOutlined 
onClick={handleIconClick(test_task_id,test_run_id)} 
style={{ width: 36 ,color: '#3875f6', filter: 'brightness(1.5)'}} />

直接在onClick属性中调用函数并传递参数的语法会有问题。
在JSX中如果想要在事件处理器(如onClick)中传递额外的参数,通常需要使用箭头函数来封装它。
否则,函数将在组件渲染时被立即执行,而不是作为实际点击事件的响应。
正确的做法可能像这样:

<MessageOutlined
  onClick={() => handleIconClick(test_task_id, test_run_id)}
  style={{ width: 36, color: '#3875f6', filter: 'brightness(1.5)' }}
/>

当你使用箭头函数时,handleIconClick 将不会在组件渲染时执行,而只在MessageOutlined组件被点击时执行。

可以看一下官网链接
React响应事件


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

相关文章

什么是HTTP DDOS,如何防护

在当今高度互联的网络世界中&#xff0c;网络安全威胁日益严峻&#xff0c;其中HTTP DDoS&#xff08;Distributed Denial of Service&#xff0c;分布式拒绝服务&#xff09;攻击作为一种常见的网络攻击手段&#xff0c;给企业和个人用户带来了巨大的挑战。今天我们就来详细介…

netty编程之基于websocket发送二进制数据

写在前面 本文看下基于websocket发送二进制数据。 1&#xff1a;正文 直接看源码吧&#xff0c;主要如下几个类&#xff1a; WebSocketServerProtocolHandler (内置)&#xff1a;负责websocket握手消息处理 BinaryWebSocketFrameHandler(自定义)&#xff1a;负责处理二进制…

Centos 7 搭建Samba

笔记&#xff1a; 环境&#xff1a;VMware Centos 7&#xff08;网络请选择桥接模式&#xff0c;不要用NAT&#xff09; 遇到一个问题就是yum 安装404&#xff0c;解决办法在下面&#xff08;没有遇到可以无视这句话&#xff09; # 安装Samba软件 yum -y install samba# 创建…

VIVADO IP核之FIR插值器多相滤波仿真

VIVADO IP核之FIR插值器多相滤波仿真&#xff08;含有与MATLAB仿真数据的对比&#xff09; 目录 前言 一、滤波器系数生成 二、用MATLAB生成仿真数据 三、VIVADO FIR插值多相滤波器使用 四、VIVADO FIR插值多相滤波器仿真 五、VIVADO工程下载 总结 前言 网络上有许多文章…

IPsec-Vpn

网络括谱图 IPSec-VPN 配置思路 1 配置IP地址 FWA:IP地址的配置 [FW1000-A]interface GigabitEthernet 1/0/0 [FW1000-A-GigabitEthernet1/0/0]ip address 10.1.1.1 24 [FW1000-A]interface GigabitEthernet 1/0/2 [FW1000-A-GigabitEthernet1/0/2]ip address

ES5 在 Web 上的现状

最后一个支持 ES5 的浏览器 IE 11 在 2022 年被微软停止支持&#xff0c;那么今天 Web 上的 ES5 现状如何&#xff1f;在构建生产代码时&#xff0c;Web 开发者的最佳实践是什么&#xff1f; 本文将通过数据来回答这些问题&#xff0c;并基于这些数据为网站开发者和库作者提供一…

如何spring启动过程中做一些额外操作

ApplicationReadyEvent 在应用程序启动时&#xff0c;可以通过监听应用启动事件&#xff0c;或者在应用的初始化阶段&#xff0c;加一些需要的操作。 ApplicationReadyEvent 是 Spring Boot 框架中的一个事件类&#xff0c;它表示应用程序已经准备好接收请求&#xff0…

基于微信小程序的游泳馆管理系统--论文源码调试讲解

2 关键技术介绍 2.1 SSM框架 开发信息管理系统的主流框架是SSM&#xff08;Spring Spring MVC MyBatis&#xff09;&#xff0c;SSM框架web层使用Spring MVC框架&#xff0c;使传输前后端数据变得简单&#xff1b;对于业务层使用Spring作为轻量级控制反转和面向切面的容器框…