setState的連鎖反應(yīng)

我們一直強(qiáng)調(diào)成都網(wǎng)站建設(shè)、成都做網(wǎng)站對(duì)于企業(yè)的重要性,如果您也覺得重要,那么就需要我們慎重對(duì)待,選擇一個(gè)安全靠譜的網(wǎng)站建設(shè)公司,企業(yè)網(wǎng)站我們建議是要么不做，要么就做好,讓網(wǎng)站能真正成為企業(yè)發(fā)展過程中的有力推手。專業(yè)網(wǎng)站制作公司不一定是大公司,成都創(chuàng)新互聯(lián)公司作為專業(yè)的網(wǎng)絡(luò)公司選擇我們就是放心。

這是一個(gè)React組件實(shí)現(xiàn)組件可交互所需的流程，render()輸出虛擬DOM，虛擬DOM轉(zhuǎn)為DOM，再在DOM上注冊(cè)事件，事件觸發(fā)setState()修改數(shù)據(jù)，在每次調(diào)用setState方法時(shí)，React會(huì)自動(dòng)執(zhí)行render方法來更新虛擬DOM，如果組件已經(jīng)被渲染，那么還會(huì)更新DOM中去。這個(gè)過程，setState就像一個(gè)點(diǎn)燃引擎的火源，發(fā)動(dòng)了React核心的調(diào)度層，然后直至渲染層的改變。
異步的setState
剛接觸React的同學(xué)，對(duì)React的setState的使用偶爾會(huì)有一些偏頗，出現(xiàn)一些意料之外的情況。例如：
onFunction=()=>{
this.setState({value: []});
// 此刻立馬取this.state做一些同步操作
console.log(this.state.value);

所以經(jīng)常犯這個(gè)錯(cuò)的同學(xué)需要謹(jǐn)記下面這幾點(diǎn)：

1. setState是異步的，不會(huì)立即改變state的值。
2. 多次setState調(diào)用生成的效果會(huì)合并。
3. 第二個(gè)參數(shù)可以是一個(gè)回調(diào)函數(shù)。
4. setState可以接受一個(gè)函數(shù)
   為什么要異步呢？
   
   每一次setState如果都引發(fā)一次組件更新，走完一圈生命周期，實(shí)在是有點(diǎn)粗糙和浪費(fèi)，生命周期函數(shù)為純函數(shù)性能應(yīng)當(dāng)還能夠接受，可是render函數(shù)內(nèi)返回的虛擬DOM去做比較這個(gè)就比較費(fèi)時(shí)間了。
   直觀的感受是，React將多個(gè)setState產(chǎn)生的修改放在一個(gè)隊(duì)列里，緩一緩，攢在一起，等待時(shí)機(jī)，覺得差不多了再引發(fā)一次更新過程。這樣，在每次更新過程中，會(huì)把積攢的setState結(jié)果合并，做一個(gè)merge的動(dòng)作，節(jié)省render觸發(fā)的頻率。
   這樣，對(duì)于開發(fā)者而言，可以在同步代碼中隨意多行調(diào)用setState函數(shù)而不用擔(dān)心重復(fù)setState重復(fù)render的問題。
   然后，總是被大家誤用不理解的也是這一點(diǎn)，所以后來，setState方法的第二個(gè)參數(shù)慢慢被進(jìn)入大家的視野了，作為回調(diào)函數(shù)可以再次拿到新的this.state值。
   再后來，一個(gè)setState函數(shù)的隱藏功能進(jìn)入了大家的視野，那就是setState可以接受一個(gè)函數(shù)作為參數(shù)。
   this.setState(function (state, props) {
   return {
   value: state.value - 1
   }
   });

本文名稱：前端知識(shí)|淺談ReactsetState
本文來源：http://jinyejixie.com/article8/jjhpip.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供外貿(mào)網(wǎng)站建設(shè)、面包屑導(dǎo)航、電子商務(wù)、手機(jī)網(wǎng)站建設(shè)、網(wǎng)站改版、營銷型網(wǎng)站建設(shè)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)