react-native - 如何在本机反应中移动到其他选项卡时暂停视频

Question

我已经在标签中实现了反应本机视频（标签是使用本机基础实现的），但是在移动到其他标签（ontabpress）时，视频仍然在后台播放。任何帮助都会得到帮助。谢谢

Answer 1

import {useNavigation} from '@react-navigation/native';

const [pause, setPause] = useState(false);
const navigation = useNavigation();

useEffect(() => {
    navigation.addListener('focus', (route) => { setPause(false) });
    navigation.addListener('blur', (route) => { setPause(true) });
}, []);

<Video
      source={{ uri: item.uri }}
      rate={1.0}
      volume={1.0}
      paused={pause}
      resizeMode="cover"
      shouldPlay={play}
      isLooping
      style={{
        width: '100%',
        height: '100%',
      }}
    />

希望这肯定会帮助你。:)

Answer 2

尝试这个

 {...}

   const [pause, setPause] = useState(false)

   useEffect(() => {
     const blur = navigation.addListener('blur', () => {
     setPause(true)
     });

     const focus = navigation.addListener('focus', () => {
     setPause(false)
     });

     return blur, focus;
   }, [navigation]);

 {...}
 
   <Video
     source={{ uri: ENTER_HERE_URL }}
     paused={pause}
     style={styles.bgView} />

 {...}