reactjs - 如何在使用 reactr-native-createthumbnail 和 react-native-video-player 上传视频之前显示缩略图
问题描述
我一直在使用 react-native 视频播放器来显示视频,直到视频加载我想显示缩略图,所以我使用 react-native-create-thumbnail 从视频生成缩略图
createThumbnail({
url: video.path,
timeStamp: 10000,
})
.then(response => {
console.log('thumbnail',response)
thumbnailUrl=response.path;
}
)
.catch(err => console.log('thumbnail err',err));
在这里我得到以下对象
thumbnail {"height": 300, "path": "file:///data/user/0/com.sheolife/cache/thumbnails/thumb-4b75eaad-2afe-4c3d-994d-3f6206ce5b75.jpeg", "width": 300}
当我在我的 Videoplayer thumbnail 道具中添加上面的 thumbnailUrl 时,它仍然显示为黑色
我尝试添加如下
<VideoPlayer
ref={videoplayerref}
video={{
uri: video
}}
paused={paused}
videoWidth={Dimensions.get("window").width}
videoHeight={400}
thumbnail={{uri:thumbnailUrl}}
resizeMode="contain"
pauseOnPress
// hideControlsOnStart
onStart={(state) => onStart(state)}
onPlayPress={(state) => onPlayPress(state)}
hideControlsOnStart={true}
/>
现在这里的 thumbnailUrl 是本地文件,所以我想写如下:
thumbnail={require(`${thumbnailUrl}`)}
但这也是抛出错误,有人可以在这里帮助我吗,我如何访问视频播放器中的缩略图路径?任何线索都会很棒。