react native - Trying to disable video when navigating away from the page

Question

I have following code and I think unloadSync() is causing an error:

useFocusEffect(
    React.useCallback(() => {
      ShowVideo(true);

      return () => {
        videoRef.current?.unloadAsync()
        .catch(err => console.debug('Error unloading video player', err));
        ShowVideo(false);
      };
    }, [])
  );


{shouldShowVideo &&
      isNotNullUndefinedZero(exercise) &&
      (
          <Video
            ref={videoElementRef}
            style={styles.videoElement}
            source={{ uri: list.videoURL }}
            rate={1.0}
            volume={1.0}
            isMuted={false}
            resizeMode="cover"
            shouldPlay
            isLooping
          />

It shows the video fine but when I navigate away from that page it throws an error:

Error unloading video player [Error: Invalid view returned from registry, expecting ABI39_0_0EXVideo, got: (null)]

Can I somehow remove source from the video using the ref hook on changing the page?

question from:https://stackoverflow.com/questions/65946264/trying-to-disable-video-when-navigating-away-from-the-page

Answer 1

Waitting for answers