码农知识堂 - 1000bd
  •   Python
  •   PHP
  •   JS/TS
  •   JAVA
  •   C/C++
  •   C#
  •   GO
  •   Kotlin
  •   Swift
  • 【无标题】


    在这个问题中,用户希望在点击确认按钮时触发handleChange函数,并且能够正确获取到最新的bzText值。最初的代码中,在handleOpen函数中弹出一个确认框,并在确认框的onOk回调函数中调用handleChange函数。然而,由于组件传值问题,导致在onOk回调函数中无法获取到最新的bzText值。

    1. const handleOpen = () => {
    2. Modal.confirm({
    3. title: `是否申请解锁经办人姓名`,
    4. content: (
    5. <div className={styles.bz}>
    6. 备注:
    7. <Input
    8. onChange={(e) => {
    9. setBzText(e?.target?.value);
    10. }}
    11. placeholder="请输入"
    12. />
    13. div>
    14. ),
    15. cancelText: '取消',
    16. okText: '确认',
    17. onOk() {
    18. handleChange('change', bzText);
    19. }
    20. });
    21. };
    22. const handleChange = (type, bzText) => {
    23. console.log(bzText, 'bzText');
    24. };
    25. // bzText是用useState声明的

    为了解决这个问题,可以使用useRef来创建一个引用(bzTextRef),并在输入框的onChange事件中更新这个引用的值。然后,在确认框的onOk回调函数中通过bzTextRef.current来获取最新的bzText值,从而确保在handleChange函数内部能够正确访问到最新的值。

    1. import { useRef } from 'react';
    2. const YourComponent = () => {
    3. const bzTextRef = useRef(null);
    4. const handleOpen = () => {
    5. Modal.confirm({
    6. title: `是否申请解锁经办人姓名`,
    7. content: (
    8. <div className={styles.bz}>
    9. 备注:
    10. <Input
    11. onChange={(e) => {
    12. bzTextRef.current = e?.target?.value;
    13. }}
    14. placeholder="请输入"
    15. />
    16. div>
    17. ),
    18. cancelText: '取消',
    19. okText: '确认',
    20. onOk() {
    21. handleChange('change', bzTextRef.current);
    22. }
    23. });
    24. };
    25. const handleChange = (type, bzText) => {
    26. console.log(bzText, 'bzText');
    27. };
    28. // bzText是用useState声明的
    29. };
    30. export default YourComponent;

    综上所述,通过使用useRef来存储bzText的引用,可以解决在确认框中无法获取到最新值的问题。

  • 相关阅读:
    java的构造方法——无参构造方法
    win11 系统 Internet Connection Sharing (ICS) 服务无法关闭-问题解决
    Programming abstractions in C阅读笔记:p176-p178
    最新推荐的直链网盘榜单
    C++实现轻量级RPC分布式网络通信框架
    【红队】ATT&CK - 自启动 - 注册表运行键、启动文件夹
    jsp 前端传值,后端接受不到
    第七十一天 来道水题得了
    颜色的感知
    Halcon我的基础教程(一)(我的菜鸟教程笔记)-halcon仿射变换(Affine Transformation)的探究与学习
  • 原文地址:https://blog.csdn.net/m0_51578916/article/details/136711879
  • 最新文章
  • 攻防演习之三天拿下官网站群
    数据安全治理学习——前期安全规划和安全管理体系建设
    企业安全 | 企业内一次钓鱼演练准备过程
    内网渗透测试 | Kerberos协议及其部分攻击手法
    0day的产生 | 不懂代码的"代码审计"
    安装scrcpy-client模块av模块异常,环境问题解决方案
    leetcode hot100【LeetCode 279. 完全平方数】java实现
    OpenWrt下安装Mosquitto
    AnatoMask论文汇总
    【AI日记】24.11.01 LangChain、openai api和github copilot
  • 热门文章
  • 十款代码表白小特效 一个比一个浪漫 赶紧收藏起来吧!!!
    奉劝各位学弟学妹们,该打造你的技术影响力了!
    五年了,我在 CSDN 的两个一百万。
    Java俄罗斯方块,老程序员花了一个周末,连接中学年代!
    面试官都震惊,你这网络基础可以啊!
    你真的会用百度吗?我不信 — 那些不为人知的搜索引擎语法
    心情不好的时候,用 Python 画棵樱花树送给自己吧
    通宵一晚做出来的一款类似CS的第一人称射击游戏Demo!原来做游戏也不是很难,连憨憨学妹都学会了!
    13 万字 C 语言从入门到精通保姆级教程2021 年版
    10行代码集2000张美女图,Python爬虫120例,再上征途
Copyright © 2022 侵权请联系2656653265@qq.com    京ICP备2022015340号-1
正则表达式工具 cron表达式工具 密码生成工具

京公网安备 11010502049817号