react使用antd-design中select不能及時刷新問題及解決
更新時間：2024年03月22日 09:39:02 作者：Emotion#
這篇文章主要介紹了react使用antd-design中select不能及時刷新問題及解決方案,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教
react使用antd-design中select不能及時刷新
react是當(dāng)前最流行的js框架之一，與之相匹配的antd也是當(dāng)下最流行的ui框架之一，最近開發(fā)遇到一個之前沒有遇到的問題，關(guān)于antd的select刷新不及時的問題，
當(dāng)時的業(yè)務(wù)環(huán)境是具有多個商務(wù)錄單，主播選擇的業(yè)務(wù).每個錄單的平臺不同主播也不一樣，主播集合是采用的循環(huán)渲染形式.
因此由于是采用的ts的寫法，每次的select中要進(jìn)行預(yù)渲染，每次更改當(dāng)前平臺，對應(yīng)的下拉不能及時更新，加key不行，setAnchor(anchor)不行，在useEffect()中監(jiān)聽anchor也不行，后來使用深拷貝內(nèi)存地址更替變量才引起視圖刷新，由于react寫的不多，第一次遇見特此記錄一下.
react異步數(shù)據(jù)更新不及時問題
最近在學(xué)習(xí)react的過程中,遇到了個問題，當(dāng)我使用useState這個hook的時候，發(fā)現(xiàn)我們這個方法更新數(shù)據(jù)他是異步更新的，數(shù)據(jù)不會及時同步上我們的頁面，在仔細(xì)的研究下
解決方法
const [value,setValue] = useState([]);
const changeValue = ()=>{
setValue(data)
console.log(value) //在此處輸出會出現(xiàn)不及時更新問題，不會同步到頁面上
}
//利用useEffect這個hook來監(jiān)聽數(shù)據(jù)的變化再去輸出或者是調(diào)用
useEffect(()=>{
console.log(value)//這樣就可以解決更新不及時的問題啦
},[value])總結(jié)
以上為個人經(jīng)驗(yàn)，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
React服務(wù)端渲染和同構(gòu)的實(shí)現(xiàn)
本文主要介紹了React服務(wù)端渲染和同構(gòu)的實(shí)現(xiàn)，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2022-04-04
解決React報(bào)錯Property?'value'?does?not?exist?on?
這篇文章主要為大家介紹了React報(bào)錯Property?'value'?does?not?exist?on?type?EventTarget的解決方法，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-12-12
React項(xiàng)目中decorators裝飾器報(bào)錯問題解決方案
這篇文章主要介紹了React項(xiàng)目中decorators裝飾器報(bào)錯，本文給大家分享問題所在原因及解決方案，通過圖文實(shí)例相結(jié)合給大家介紹的非常詳細(xì),需要的朋友可以參考下2023-01-01
條件渲染在React開發(fā)中非常重要的功能,它允許開發(fā)人員根據(jù)條件控制渲染的內(nèi)容,在創(chuàng)建動態(tài)和交互式用戶界面方面發(fā)揮著至關(guān)重要的作用,本文總結(jié)了常用的的條件渲染方法,需要的朋友可以參考下2024-01-01
以文本為例,為了實(shí)現(xiàn)無限循環(huán)的視覺效果,我們需要準(zhǔn)備兩段相同的文本,并讓第二段文本的頭部銜接在第一段文本的尾部,同時,為兩段文本設(shè)置相同的滾動動畫,本文給大家介紹了基于React實(shí)現(xiàn)無限滾動表格,需要的朋友可以參考下2023-11-11
這篇文章主要介紹了react 國際化的實(shí)現(xiàn)代碼示例，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-09-09
這篇文章主要為大家介紹了React的生命周期函數(shù)初始掛載更新移除詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-08-08
這篇文章主要介紹了React中Provider組件使用場景,使用Provider可以解決數(shù)據(jù)層層傳遞和每個組件都要傳props的問題,本文結(jié)合示例代碼給大家介紹的非常詳細(xì),感興趣的朋友跟隨小編一起看看吧2024-02-02
React?Hooks useReducer?逃避deps組件渲染次數(shù)增加陷阱
這篇文章主要介紹了React?Hooks?之?useReducer?逃避deps后增加組件渲染次數(shù)的陷阱詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-09-09
這篇文章主要介紹了使用React.forwardRef傳遞泛型參數(shù)方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-05-05