問題
開發(fā)一個(gè)帶有固定標(biāo)題的頁面時(shí)糊秆，使用到了van-tab組件，標(biāo)題用了vant的導(dǎo)航欄，是固定在頭部的
原型頁.png
因?yàn)樾枨笾幸髒an-tab有吸頂功能勋锤，所以使用了van-tab的
sticky和offset-top屬性，并將offset-top的值寫了和導(dǎo)航欄一樣的高度46px侥祭，然后我在電腦瀏覽器的h5模式下測試是正常的叁执，但到手機(jī)上（ReactNative的webview里），就發(fā)現(xiàn)往上滑動時(shí)矮冬，tab出現(xiàn)抖動的情況谈宛，在一番百度之后也沒有找到有效的答案，就寫了一個(gè)臨時(shí)方案來處理胎署。
分析
在觀察問題之后吆录，我發(fā)現(xiàn)是offset-top的值和導(dǎo)航欄的高度是一樣的，按理來說向上滑動時(shí)琼牧，tab應(yīng)該是固定的（在電腦瀏覽器上確實(shí)是這樣）恢筝，但在手機(jī)上tab卻輕微向上移動了大概1px（此時(shí)tab的頂部大概在40px高度的地方）哀卫，然后才吸頂去到高度41px的地方，正是因?yàn)檫@個(gè)原因所以導(dǎo)致滑動時(shí)出現(xiàn)抖動的情況
方案
于是我嘗試把offset-top的值設(shè)置的比導(dǎo)航欄高度大1px撬槽，這樣應(yīng)該就不會出現(xiàn)向上移動的情況此改，測試之后確實(shí)不會出現(xiàn)抖動的情況，不過由于tab比導(dǎo)航欄高了1px侄柔，出現(xiàn)了間隙
效果圖.png
于是找到van-tab的.van-tabs__wrap共啃，給他寫了個(gè)偽元素來蓋住這個(gè)縫隙
.van-tabs__wrap::before {
position: fixed;
top: 46px; // 設(shè)置成和導(dǎo)航欄一樣的高度
z-index: 100;
content: '';
height: 2px;
width: 100%;
background-color: #fff;
}
最后在ios和幾個(gè)安卓手機(jī)上測試都沒有問題，不過這也只是一個(gè)臨時(shí)方案暂题，如果有大佬了解具體原因移剪，煩請?jiān)u論區(qū)留個(gè)言告知一下，感激不盡
感謝.jpg
補(bǔ)充
.van-sticky 是動態(tài)添加 position: fixed, 給他寫個(gè)死的position: fixed,就行了
這個(gè)是評論區(qū)的大哥給的方法薪者，嘗試之后確實(shí)可行挂滓，感謝
