1.一個(gè)簡單的需求爸业，入下圖抱冷，當(dāng)屏幕向下滾動(dòng)到tab欄（下圖中第二個(gè)，正常文檔流存在于頁面中）時(shí)让禀，隱藏的fixed的同樣的tab欄會(huì)顯現(xiàn)（下圖中第一個(gè)），我的思路和很多人一樣判斷tab欄的offsetTop_tab和滑動(dòng)的scrollTop陨界，當(dāng)scrollTop >= offsetTop_tab時(shí)就把隱藏的tab欄顯示出來巡揍。但是寫代碼時(shí)由于scroll事件觸發(fā)的頻率較多，故我在事件處理程序外就用一個(gè)變量接收了第二個(gè)offsetTop_tab菌瘪，以免每次取時(shí)都觸發(fā)重繪重排腮敌。我在測試環(huán)境下測試沒有問題，但是一丟到正式環(huán)境就發(fā)現(xiàn)出問題了俏扩，offsetTop_tab這個(gè)值不對(duì)（偏忻庸ぁ），導(dǎo)致隱藏的會(huì)提前顯示出來录淡。
產(chǎn)生原因：經(jīng)過分析在react的componentDidMount生命周期函數(shù)中捌木，頁面的結(jié)構(gòu)并未完全的解析渲染（你可以理解為數(shù)據(jù)沒返回來的空殼這個(gè)DOM結(jié)構(gòu)以及樣式并未成型），所以我一進(jìn)這個(gè)生命周期就抓取offsetTop_tab的值并不準(zhǔn)確嫉戚。
ps：之前用vue開發(fā)也遇到過類似的問題刨裆，在父組件中通過this.$children[index]來抓取父組件中的各個(gè)子組件，通常情況下我們可能認(rèn)為父組件中頁面結(jié)構(gòu)從上到下的子組件的index依次是0,1,2......彬檀，但是實(shí)際情況并不一定能夠就是這樣的帆啃，index的順序是根據(jù)這個(gè)子組件渲染的先后順序決定的，比如father組件里面有三個(gè)子組件結(jié)構(gòu)上從上到下依次是ChildOne窍帝、ChildTwo努潘、ChildThree，若實(shí)際渲染的先后順序ChildThree--->ChildOne--->ChildTwo,那么他們的index分別為ChildOne：1坤学，ChildTwo:2疯坤，ChildThree:0
解決方式：將取tab欄offsetTop的代碼移動(dòng)到設(shè)定data讓數(shù)據(jù)渲染到頁面上后（setDate的回調(diào)里面），此時(shí)的DOM結(jié)構(gòu)已穩(wěn)定拥峦。
2. 在某些機(jī)型上尺寸會(huì)和你計(jì)算的尺寸相差1~2個(gè)像素贴膘，所以當(dāng)你發(fā)現(xiàn)某個(gè)機(jī)型上你計(jì)算的尺寸要觸發(fā)的事件沒有觸發(fā)，那么嘗試著試試添加或減少2個(gè)像素debug試試看略号。
3.在iOS webview上刑峡，當(dāng)你引入的某個(gè)腳本頁面沒找到的話，那么這個(gè)頁面可能會(huì)直接不會(huì)顯示玄柠，同樣的safari瀏覽器也是一樣突梦。若你取的某個(gè)變量沒有值（通常我們會(huì)認(rèn)為是undefined，但是在蘋果的瀏覽器上會(huì)報(bào)錯(cuò)）也會(huì)報(bào)錯(cuò)羽利。
4.在使用vue的時(shí)候宫患，Mounted生命周期中只是渲染了頁面結(jié)構(gòu)，數(shù)據(jù)并未填充進(jìn)去（除非你設(shè)置了默認(rèn)數(shù)據(jù)）这弧，此時(shí)你取某個(gè)div的高或者scrolltop等并非是你想像的數(shù)據(jù)娃闲，可能是0虚汛。例如我在localstorage中存儲(chǔ)了用戶返回操作需要返回到之前瀏覽這個(gè)頁面的高度，可能一開始你在moubted里面直接設(shè)置scrollTop并不合適（不起作用),此時(shí)你可以嘗試著加個(gè)定時(shí)器來延遲執(zhí)行皇帮。
