我想自动播放嵌入的YouTube视频在我的反应本机应用程序。
这里是我的代码,
render() {
const { data } = this.props;
const { loading } = this.state;
return (
<View>
<CloseButton onTrigger={this.closeModal.bind(this)} />
<PlayIcon onTrigger={this.playVideo} />
<Image source={{uri:data.src}} resize='contain' style={{height:250}} />
<Image
source={require('../../assets/img/grediant.png')}
resizeMode='cover' style={styles.gradientImage} />
<ContentWidget style={styles.infoContentTwo}>
<MyAppText style={{color:'white'}}>{data.title}</MyAppText>
</ContentWidget>
{this.state.openVideo && <View style={styles.webViewStyle}>
<WebView style={{height:250}} source={{uri:`${data.video}?autoplay=1`}} fullScreen={true} />
</View>}
{loading && <Spinner />}
</View>
);
}
但它不工作,我有一个playIcon自定义按钮,如果我点击按钮后,YouTube视频应该发挥。我不知道我在哪里错了代码。
您可以将用户的反应,原生的YouTube嵌入YouTube视频到你的反应本地项目。您可以将属性配置为自动播放视频。
<YouTube
videoId="KVZ-P-ZI6W4" // The YouTube video ID
play={true} // control playback of video with true/false
onReady={e => this.setState({ isReady: true })}
onChangeState={e => this.setState({ status: e.state })}
onChangeQuality={e => this.setState({ quality: e.quality })}
onError={e => this.setState({ error: e.error })}
style={{ alignSelf: 'stretch', height: 300 }}
/>