更改状态后重新呈现Expo Video

Question

我有一个视频，上面我想要一个播放按钮。我通过以下方法实现了这一点：

                <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并控制是否渲染播放按钮图标。我尝试过的任何操作都会导致视频在致电setIsPlaying时闪烁，或者导致视频重新呈现并且根本无法播放。

任何帮助将不胜感激。