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立即消散