react native裏在ios平臺引用webview時由於平臺差異無故出現黑邊解決方案

react native裏在ios平臺引用webview時由於平臺差異無故出現黑邊解決方案

不久前在做有關引用webview的開發時，頁面中在webview的下方無緣無故出現了黑邊，而且每一次橫豎屏切換時黑邊還會加粗，自己在谷歌百度上面一通好找。。。。還是沒有解決此問題的方法，只找到了ios開發中此問題的解決方案，奈何我沒有做過ios的開發。。。看不懂啊。。內心崩潰，經過一番琢磨，終於找到了此問題在RN中的解決方案，上代碼：

webView(){
    return(
        <View style={{flex:4,zIndex:-10,alignItems:'center',justifyContent:'center'}} onLayout={()=>{this.handleLayout()}}>
            <WebView
                style={{backgroundColor:'clearColor',opaque:'no',}}
                ref={(w) => { this.webview = w;StateInfoGlobal.webView = w }}
                javaScriptEnabled={true}
                domStorageEnabled={true}
                scalesPageToFit={true}
                source={Platform.OS == 'ios' ? require('../../ios/assets/src/component/RemoteControl.html') : {uri: 'file:///android_asset/RemoteControl.html'}}>
            </WebView>
        </View>
    )
}

重要的一句是這句：

style={{backgroundColor:'clearColor',opaque:'no',}}

將WebView中的style屬性里加入

backgroundColor:'clearColor',opaque:'no'

即可，此bug立即消散