react使用antd-design中select不能及时刷新问题及解决

 更新时间:2024年03月22日 09:39:02   作者:Emotion#  
这篇文章主要介绍了react使用antd-design中select不能及时刷新问题及解决方案,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教

react使用antd-design中select不能及时刷新

react是当前最流行的js框架之一,与之相匹配的antd也是当下最流行的ui框架之一,最近开发遇到一个之前没有遇到的问题,关于antd的select刷新不及时的问题,

当时的业务环境是具有多个商务录单,主播选择的业务.每个录单的平台不同主播也不一样,主播集合是采用的循环渲染形式.

因此由于是采用的ts的写法,每次的select中要进行预渲染,每次更改当前平台,对应的下拉不能及时更新,加key不行,setAnchor(anchor)不行,在useEffect()中监听anchor也不行,后来使用深拷贝内存地址更替变量才引起视图刷新,由于react写的不多,第一次遇见特此记录一下.

react异步数据更新不及时问题

最近在学习react的过程中,遇到了个问题,当我使用useState这个hook的时候,发现我们这个方法更新数据他是异步更新的,数据不会及时同步上我们的页面,在仔细的研究下

解决方法

const [value,setValue] = useState([]);
const changeValue = ()=>{
    setValue(data)
    console.log(value) //在此处输出会出现不及时更新问题,不会同步到页面上
}
 
//利用useEffect这个hook来监听数据的变化再去输出或者是调用
useEffect(()=>{
    console.log(value)//这样就可以解决更新不及时的问题啦
},[value])

总结

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • 深入了解React中的合成事件

    深入了解React中的合成事件

    React 中的事件,是对原生事件的封装,叫做合成事件。这篇文章主要通过几个简单的示例为大家详细介绍一下React中的合成事件,感兴趣的可以了解一下
    2023-02-02
  • 详解React-Native解决键盘遮挡问题(Keyboard遮挡问题)

    详解React-Native解决键盘遮挡问题(Keyboard遮挡问题)

    本篇文章主要介绍了React-Native解决键盘遮挡问题(Keyboard遮挡问题),具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-07-07
  • TypeScript在React中的应用技术实例解析

    TypeScript在React中的应用技术实例解析

    这篇文章主要为大家介绍了TypeScript在React中的应用技术实例解析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-04-04
  • 在console中打印React Fiber树的操作步骤

    在console中打印React Fiber树的操作步骤

    React Fiber 是 React 16 中引入的新的协调引擎或重写的核心算法, 真针Fiber的一个重要的核心概念Fiber Node,这次主要的研究对象是: 如何从使用者/学习 者角度 在js 代码上 拿到fiber 树结构的信息,,需要的朋友可以参考下
    2024-04-04
  • React类组件中super()和super(props)的区别详解

    React类组件中super()和super(props)的区别详解

    这篇文章给大家详细介绍了React类组件中super()和super(props)有什么区别,文中通过代码示例给大家介绍的非常详细,对大家的学习或工作有一定的帮助,需要的朋友可以参考下
    2024-01-01
  • React修改数组对象的注意事项及说明

    React修改数组对象的注意事项及说明

    这篇文章主要介绍了React修改数组对象的注意事项及说明,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-12-12
  • React应用框架Dva数据流向原理总结分析

    React应用框架Dva数据流向原理总结分析

    这篇文章主要为大家介绍了React 应用框架Dva数据流向原理总结分析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-12-12
  • react系列从零开始_简单谈谈react

    react系列从零开始_简单谈谈react

    下面小编就为大家带来一篇react系列从零开始_简单谈谈react。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-07-07
  • 使用React Router v6 添加身份验证的方法

    使用React Router v6 添加身份验证的方法

    这篇文章主要介绍了使用React Router v6 进行身份验证完全指南,本文将演示如何使用React Router v6创建受保护的路由以及如何添加身份验证,需要的朋友可以参考下
    2022-05-05
  • 浅谈React和Redux的连接react-redux

    浅谈React和Redux的连接react-redux

    本篇文章主要介绍了浅谈React和Redux的连接react-redux,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-12-12

最新评论