反应本机 youtube - 组件不可见

Question

加载到我的页面时，我看不到播放器：

return (
    <YouTube
      apiKey="xxx"
      videoId={youtubeVideo} // The YouTube video ID
      play={false} // control playback of video with true/false
      fullscreen={false} // control whether the video should play in fullscreen or inline
      loop={false} // control whether the video should loop when ended
      onReady={e =>  console.log('ready')}
      onChangeState={e =>  console.log('onchange')}
      onChangeQuality={e =>  console.log('change quality')}
      onError={e => console.log(e.error)}
      style={{ alignSelf: "stretch", height: 300 }}
    />

);

我收到 onReady 回调的控制台日志，但没有视频。如何显示我的视频？

有没有更好的选择？研究了这两个包，react-native-youtube 和 react-native-vimeo。两者都有一段时间没有维护并且存在各种问题。

从符合 Play 和 App Store 指南的 youtube 嵌入视频的最佳方式是什么？ Play 商店中有很多基于视频的应用程序，其他人是怎么做的？

Answer 1

您的 YouTube 组件是否包裹在带有 flex 的父视图中？我在我的应用程序中使用了相同的包，它似乎工作正常，这几乎就是我设置它的方式。

// Parent view (page container)
<View style={{ flex : 1 }}>
    ...
    <Youtube 
        apiKey={API_KEY}
        videoId={videoID}
        style={{ marginTop : 15, height : 250, alignSelf : 'stretch' }} />
    ...
</View>

反应本机 youtube - 组件不可见

React native youtube - component not visible

youtube

react-native