如何解决检查屏幕是否变得模糊或在 React Native 中聚焦?
我正在使用这个
useEffect(() => {
const navFocusListener = navigation.addListener('didFocus',() => {
console.log('focus');
});
return () => {
navFocusListener.remove();
};
},[]);
我正在使用此代码还尝试了其他侦听器。但是没有任何好处,我正在使用 react-native-immediate-call 包进行 ussd 拨号,但因为它没有任何回调。所以我将此功能称为拨号器,用于拨打 USSD 代码。所以现在我希望当 ussd 拨号完成然后回到屏幕并且一个 api 将调用以获得响应。那么我如何才能检测到 USSD 拨号正在运行或已完成,以便我可以向 api 发出请求。
解决方法
对于焦点监听器;您必须将 'didFocus' 更改为 'focus',如果您使用的是 react navigation v5+,并且您应该更新如下:
React.useEffect(() => {
const unsubscribe = navigation.addListener('focus',() => {
// do something
});
return unsubscribe;
},[]);
您可以查看其文档 from here。
,在 react-navigation 5 中,您可以执行此操作来检查屏幕是聚焦还是模糊, 使用 usefocuseffect-hook
在反应导航 5 中尝试此操作useEffect(
() => navigation.addListener('focus',() => {}),[navigation]
);
useEffect(
() => navigation.addListener('blur',[navigation]
);
,试试这个谢谢
import { NavigationEvents } from "react-navigation";
callback=()=>{
alert('I m always working when you come this Screen')
}
in return (
<Your Code>
<NavigationEvents onWillFocus={() => callback()} />
<Your Code/>
)
,
实际上,您需要检测应用状态是否在前台或后台,或者需要通过编写react-native-immediate-call中添加回调函数strong>android or ios 像这样的包
import React,{ useRef,useState,useEffect } from "react";
import { AppState,StyleSheet,Text,View } from "react-native";
const AppStateExample = () => {
const appState = useRef(AppState.currentState);
const [appStateVisible,setAppStateVisible] = useState(appState.current);
useEffect(() => {
AppState.addEventListener("change",_handleAppStateChange);
return () => {
AppState.removeEventListener("change",_handleAppStateChange);
};
},[]);
const _handleAppStateChange = (nextAppState) => {
if (
appState.current.match(/inactive|background/) &&
nextAppState === "active"
) {
console.log("App has come to the foreground!");
}
appState.current = nextAppState;
setAppStateVisible(appState.current);
console.log("AppState",appState.current);
};
return (
<View style={styles.container}>
<Text>Current state is: {appStateVisible}</Text>
</View>
);
};
const styles = StyleSheet.create({
container: {
flex: 1,justifyContent: "center",alignItems: "center",},});
export default AppStateExample;
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。