May 5, 2022
0
Level 8
React Native: TypeError: navigationRef.isReady is not a function. (In 'navigationRef.isReady()'
Hi everybody, in my react-native app App.js I setup a listener for firebase notifications, I also setup navigation in order to navigate and get current name inside notif handler functions, however when my app mounts I get this error:
TypeError: navigationRef.isReady is not a function. (In 'navigationRef.isReady()', 'navigationRef.isReady' is undefined)
getCurrentRoute
In my App.js file
import { navigationRef, isReadyRef, getCurrentRoute, navigate } from '@env/RootNavigation.js';
useEffect(() =>
{
console.log('APP STARTED');
registerListener();
}, []);
const registerListener = () =>
{
messaging().onMessage((message) => {
handleForegroundNotification(message);
});
};
const handleForegroundNotification = (message) =>
{
let routeName = getCurrentRoute();
Alert.alert(routeName);
};
<NavigationContainer ref={navigationRef} onReady={ () => { isReadyRef.current = true; } }>
<ROOTSTACK1></ROOTSTACK1>
</NavigationContainer>
In my RootNavigation file:
import * as React from 'react';
export const isReadyRef = React.createRef();
export const navigationRef = React.createRef();
export function navigate(name, params) {
if (isReadyRef.current && navigationRef.current) {
// Perform navigation if the app has mounted
navigationRef.current.navigate(name, params);
} else {
// You can decide what to do if the app hasn't mounted
// You can ignore this, or add these actions to a queue you can call later
}
};
export function getCurrentRoute(){
if (navigationRef.isReady()) {
const route=navigationRef.getCurrentRoute();
console.log(route);
// sample output {key:"Home-k2PN5aWMZSKq-6TnLUQNE",name:"Home"}
return route.name;
}
};
Please or to participate in this conversation.