Using WebView in react native - react-native

Question

I want to use a WebView to display a youtube playlist whenever I click on a image. But I can't manage to display the WebView, only a blank white page. Here is the code :
showBelier(){
this.setState({ishowing:true});
return(
<WebView
javaScriptEnabled={true}
domStorageEnabled={true}
source={{ uri: "https://www.youtube.com/watch?v=WiOKM4SvC5U&list=PLSlVQ0kIy6qx3s6EHtgStY2kzVfXKwuFD" }}
/>
)}
<View style = {{flexDirection: 'row', justifyContent:'space-between', position:'relative'}}>
<TouchableOpacity onPressIn={() => this.setState({belier: !this.state.belier})} onPress={()=> this.showBelier()}>
<Image style = {styles.image} source={ this.state.belier === true ? require("../Images/couleurs/icons8-belier-100.png")
: require("../Images/gris/beliergris.png")}/>
</TouchableOpacity>
</View>
Thanks in advance !

Answer 1

If you have a render method like showBelier inside another function of an element it won't be visible. Please include the method inside your render like this:
<View>
<TouchableOpacity onPress={() => this.setState({belier: !this.state.belier})}}>
....
</TouchableOpacity>
{this.showBelier()}
</View>
And adjust your method like this:
showBelier(){
if(this.state.belier) {
return(
<WebView
javaScriptEnabled={true}
domStorageEnabled={true}
source={{ uri: "https://www.youtube.com/watch?v=WiOKM4SvC5U&list=PLSlVQ0kIy6qx3s6EHtgStY2kzVfXKwuFD" }}
/>
)}
}