react使用antd-design中select不能及时刷新问题及解决
(福利推荐:你还在原价购买阿里云服务器?现在阿里云0.8折限时抢购活动来啦!4核8G企业云服务器仅2998元/3年,立即抢购>>>:9i0i.cn/aliyun)
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中如何理解usestate、useEffect副作用、useRef标识和useContext
这篇文章主要介绍了react中如何理解usestate、useEffect副作用、useRef标识和useContext,其实与vue中的ref和reactive一样,通过useState获取到的数据可以实现组件视图实时交互,而普通定义的数据仅仅在业务中使用,需要的朋友可以参考下2022-11-11React?+?Typescript领域初学者的常见问题和技巧(最新)
这篇文章主要介绍了React?+?Typescript领域初学者的常见问题和技巧,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2022-06-06
最新评论