bug1:頁面上的某模塊閃爍,或者部分區域白屏(其他區域良好),手按一下或點擊下,又會展示出來。
原因:該模塊區域,比如整個是一個View組件包着的內容,是 overflow:'hidden' 和 borderRadius 兩個屬性沖突導致,當需要圓角視圖而內容區域又確實超出了內容,所以一定是需要溢出隱藏 overflow:'hidden' 這個屬性的。
解決方法: 用圖片來代替圓角效果,麻煩ued同學切兩個圓角圖片,布局上用定位蓋上去。
bug2: 大致表現還是如上面現象,但當前頁面並沒有用到 overflow:'hidden' 和 borderRadius 任何一個屬性。滾動內容,內容經過容易某一塊區域就會白屏或者閃爍。
原因:上個頁面有用這2個屬性,overflow:'hidden' 和 borderRadius,上個頁面堆疊在當前頁面的下方,也會影響當前頁面的同等位置上模塊的展示。
論證:直接通過url跳到該頁面,則一切正常,若經過上頁面再到當前頁面就會出現此現象。
解決方法: 如上 bug1
bug3: view標簽,設置了圓角,在華為手機上偶現(特別是內容重新render后),會導致圓角不生效。
原因: 只能稱之為猜測原因,從RN層或者react角度無法解釋。安卓的渲染機制是把圓角屬性滯后處理,可能緩存當中存的是圓角屬性生效之前的該控件狀態,所以render之后取緩存來渲染,導致圓角失效。
解決方法:加個key值,比如 <View style={styles.wrap} key={'radius'}></VIew> 就是如此神奇。
總結:RN在安卓機型上的確是詭異的bug很多,特別是華為和oppo,一加等機型上。由於各廠商都是基於開源安卓系統之上自己會去做一些個性化定制化的改動處理,導致出現的各種差異就很詭異。以上幾個bug雖說是短短幾句話,但找原因可是找了好幾天,google也沒能找到啥答案,如果對您有幫助,歡迎留言點贊呀!