react 函数自调用

最新推荐文章于 2024-04-25 12:56:45 发布
最新推荐文章于 2024-04-25 12:56:45 发布
阅读量447 收藏 1
点赞数
文章标签： react bug javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_44255141/article/details/119326225
版权

react爬坑日记（函数自调用）

在react实际开发中，经常可能会因为一些写法的原因，导致出现一些莫名其妙的BUG

1.例如 函数加不加小括号的问题


在这里可以看到在进行审批的函数，handleOk 这个函数我们没有加入括号 所以我们的功能还是正常执行的，不会出现跳跃式的BUG。
在这里插入图片描述
但是如果咱们是这样写的话，这个函数就会因为react绑定dom的方式而变得立即执行

解决这个问题的话，我们有两个方法
1.如果不需要传参 我们直接写 函数名
2. 如果需要传参，我们就用下面这个方式
在这里插入图片描述

如有不当之处 欢迎各位大佬指出

高境界偷懒仔
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
React Hooks 使用一次调用的函数侦听鼠标按下或抬起并单击事件
06-08
使用-mouse-action React Hooks 使用一次调用的函数来侦听鼠标按下或抬起以及单击事件。 示例 此钩子可用于创建快速可用的下拉按钮。 安装 npm install use-mouse-action Usage import useMouseAction from 'use-mouse-action'; const Component = () => { const props = useMouseAction({ onAction: () => console.log('You clicked or mouse down me!'), down: true }); 返回（快速点击我！ ）； }; Hooks 这个库提供了三个 React Hooks： useMouseAction useMouseDown useMouseUp 他们都想要相同的参数：要么是回调函数，要么是在 onAction 参数中带有回调函数的选项对象。 它们都返回一个事件侦听器对象以添加到元素上。 导入 { useMouseDown } from 'use-mouse-action'; /**
React的setState立即执行方案
热门推荐
让优秀成为一种习惯
03-22 1万+
本文主要说明如何使this.setState({})中的state立即执行。 在react中只要状态state，无法设置全局变量，我们需要通过设置state来设置。 而，state是异步执行的，只有render发生变化的时候才触发this.setState()。
react中点击事件带参数会立即执行
wandoumm的博客
11-24 318
点击事件btnAction('XXX')}>点击事件点击事件
react 调用 function 的写法 及 解决 react onClick 方法自动执行
weixin_33856370的博客
07-05 5283
1.react 调用方法的写法 （1）方式一 onClick={this.getFetchData.bind(this,item.id)} （2）方式二 getFetchData(e){ this.setState({ value: e.target.value }) } onClick={(event)=>this.getFetchData(event)} （3）...
React类组件调用函数组件的方法及使用函数组件的state变量
qq_40315971的博客
06-03 8462
函数组件内容如下，主要使用到了react hook， https://react.docschina.org/docs/hooks-overview.html hook概览 https://react.docschina.org/docs/hooks-faq.html#can-i-make-a-ref-to-a-function-component import React, {useState, useRef, useImperativeHandle, forwardRef } ...
01-3 React组件（类组件、函数组件、props、state）
前端知识库
05-19 2025
目录 类组件和函数组件 如何使用 props 和 state 外部数据和内部数据 如何绑定事件 复习this 1.组件 component 1.1 Element 和 component const div = React.createElement('div',...) 这是一个React元素（d小写） const Div = ()=> React.createElement('div',...) 这是一个React组件（D大写） 1.2 什么是组件 能跟其他物件组合起来的物件，就是组件
在 React 中，如果你写了 onClick = "this.function()"，这会在组件加载时立即执行该函数，为什么它相当于在组件的 HTML 元素上直接执行该函数？...
weixin_35750953的博客
02-10 181
在这种写法中，您将字符串 "this.function()" 直接传递给 onClick 属性。这意味着，在组件加载时，JavaScript 将立即评估该字符串，并执行函数。 这与在 HTML 元素上直接执行函数类似，因为它在组件加载时立即执行，而不是在点击事件发生时才执行。 与此相反，正确的方法是将函数作为 onClick 的值传递，例如： onClick={this.function} 这样，...
【React】 12课 react的生命周期函数执行顺序详解
舜岳的博客
07-03 1639
1. Mounting 初始化阶段（挂载阶段）执行的函数： ①构造函数（里面存放this.state组件数据） constructor (props){ //props是父组件传过来的参数 super(props); this.state = {} } ②组件即将被挂载 componentWillMount(){} ③更新渲染 render(){} ④组件已经渲染完成了 compo...
React自执行函数
XiaoSen207的博客
06-14 1206
React自执行函数
彻底搞懂 React 生命周期
BLUEHEART
03-11 1691
1. React的生命周期有哪些？ React 通常将组件生命周期分为三个阶段： 装载阶段（Mount），组件第一次在DOM树中被渲染的过程； 更新过程（Update），组件状态发生变化，重新更新渲染的过程； 卸载过程（Unmount），组件从DOM树中被移除的过程； https://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/ 1.1 组件挂载阶段 挂载阶段组件被创建，然后组件实例插入到 DOM 中，完成组件的第一次渲染，该过程只会发生
30分钟精通React今年最劲爆的新特性——React Hooks
01-19
你还在为该使用无状态组件（Function）还是有状态组件（Class）而烦恼吗？ ——拥有了hooks，你...如果你也对react感兴趣，或者正在使用react进行项目开发，答应我，请一定抽出至少30分钟的时间来阅读本文好吗？所有
ReactNative源码分析之NativeModule调用堆栈分析
01-03
当前分析的ReactNative版本为0.61.5: 一、NativeModule基本使用 我们知道，要想访问原生提供的功能，需要通过继承NativeModule，并提供相关的方法，只有这样JS层才能直接访问。 举个例子，StatusBarModule类： /** {...
React Hooks的深入理解与使用
12-12
你还在为该使用无状态组件（Function）还是有状态组件（Class）而烦恼吗？ ——拥有了hooks，你再也不...如果你也对react感兴趣，或者正在使用react进行项目开发，答应我，请一定抽出至少30分钟的时间来阅读本文好吗
前端React中函数式hooks组件中关于ref使用介绍，以及forwardRef 与 useImperativeHand详解
11-30
知识领域：前端 React、函数式Hooks组件、Class类组件技术关键字： ref + createRef + useRef + forwardRef + useImperativeHand内容概要：解决在react中父组件调用子组件中的方法问题，尤其是函数式组件，子组件...
修复所有 bug 并不能解决所有问题
最新发布
阿然的专栏
04-25 206
即使修复软件中所有的 bug，也并不能解决系统设计与实现的问题，系统问题需要同样的热情。
重庆思庄技术分享——Bug 12861117 RMAN 会话旋转
m0_61458430的博客
04-22 478
RMAN-00569：===============错误消息堆栈跟随===============关闭（例如：如果从管道或其他管道读取），RMAN 会话可能会无限旋转。在某些情况下，如果写入日志文件时遇到磁盘已满的情况。在某些平台上，rman 会话将在写入日志时遇到磁盘。RMAN-00558：解析输入命令时遇到错误。RMAN-00558：解析输入命令时遇到错误。RMAN-01006：解析期间发出错误信号。RMAN-01006：解析时发出错误信号。RMAN-00565：无法读取输入文件。
【bug】使用mmsegmentaion遇到的问题
编程小白的博客
04-22 781
datasets/coalDataset.py配置文件，与其他配置对比之后发现自己将val_dataloader里面的pipeline写成了train_pipeline，以后还是得长点心哇，这个bug卡太久了。由于之前用自己数据集跑过internImage，想投机取巧把internImage自定义的配置文件拿过来直接用，果不其然报错了。所有的输出都是合适的，图像和标签大小没有问题，将问题转到配置文件中数据增强部分也就是自定义的configs/和问题二一样，在训练时没有问题，到了评估出指标时就开始报错。
bug是测不完的，根本测不完
qq_42904438的博客
04-19 459
恼火，测不完的bug，异常场景的bug要测，样式的问题要测，一旦变动一个需求，还要全盘通策，活生生的卖命啊！那就只走正常的业务流程，时间多再异常场景测试吧。简直不知道要怎么测试了。
微信小程序地图polyline坐标太多异常显示BUG
qq_33982898的博客
04-19 681
微信小程序map地图上显示polyline线，点位超过1250个出现bug，（仅真机上出现，模拟器上正常）
react函数式如何调用接口
04-29
在 React 函数式组件中调用接口通常需要使用 React Hooks 中的 useEffect 和 useState。useEffect 用于在组件渲染后执行副作用操作，例如从服务器获取数据，而 useState 用于在组件中存储数据。 下面是一个示例代码...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值