React native 世博会视频重新呈现状态变化

我有一个视频，我想要的就是在上面有一个播放按钮。我通过以下几点做到了这一点：

                <View style={{ backgroundColor: 'yellow', justifyContent: 'center', alignItems: 'center'}}>
                    <Video
                        ref={setupVideo}
                        source={require('../../assets/AppSampleCoverVideo.mp4')} // TODO:
                        rate={1.0}
                        volume={1.0}
                        isMuted={false}
                        shouldPlay={isPlaying}
                        resizeMode='contain'
                        isLooping={false}
                        style={styles.setupVideo}
                        //onPlaybackStatusUpdate={onPlaybackStatusUpdate}
                        //useNativeControls={true}
                    />

                    <TouchableOpacity style={styles.playButton} onPress={toggleVideoPlay}>
                        {
                            !isPlaying ? (
                                <Ionicons style={styles.playIcon} color='white' size={ Dimensions.get('window').width / 5 } name='ios-play' />
                            ) : null
                        }
                    </TouchableOpacity>

                </View>

    const [isPlaying, setIsPlaying] = useState(false)
    const setupVideo = useRef(null);

    const toggleVideoPlay = async () => {
        try {
            let videoStatus = await setupVideo.current.getStatusAsync();
            if(videoStatus.isPlaying) {
                return setupVideo.current.pauseAsync();
            } else {
                if(videoStatus.durationMillis === videoStatus.positionMillis) return setupVideo.current.replayAsync();
                return setupVideo.current.playAsync();
            }
        } catch(err) {

        }
    }

但是，我希望能够跟踪视频何时播放以及何时不播放，以便设置isPlaying并控制播放按钮图标是否渲染。我尝试过的任何操作都会导致视频在调用

setisplay

时闪烁，或者视频重新渲染，根本无法播放

任何帮助都将不胜感激