Gabotronix's avatar

React Native: getting route params typeof string?

Hi everybody, in my app I use react native firebase notifications (fcm) I'm experiencing a very weird bug, after I click on background notification I navigate to a new screen, in this screen useEffect I check for route params type and I get 'string', because of this I have to first do a JSON.parse, the weird thing is before navigation code, in App.js, I check they type of notification data sent from the server and it's object.

So right after navigation object gets turned into string type and I have to do JSON.parse, I'd prefer to not have to do this...

App.js

const handleBackgroundNotificationClicked = (data) =>
    {
        let notifData = data.data;
        console.log('notifDataType',typeof notifData);
        //RETURNS OBJECT, AS IT SHOULD
         navigate('OrderList88888', { activeUser:data.user })
}

In the screen where I navigate to I'm using useEffect to check route params type and they return type 'string':

const route = useRoute();

    useEffect(() => {
      
      //THIS RETUTNS STRING (WHY WAS IT CONVERTED TO STRING?)
        console.log('routeParamsType',typeof route.params.activeUser);

        let obj = JSON.parse(route.params.activeUser);
        console.log('objType',typeof obj);
        //THIS RETURNS OBJECT AND NOW I CAN USE THIS DATA
        
        getById(obj.id);
        
    }, []);

I also can't deconstruct params object like I in other screens where I navigate with useNavigation object

const { activeUser} = useRoute().params;

I instead have to use

const route = useRoute()
route.params.activeUser

I fear this is maybe because I'm using a navigation ref (since you can't use useNavigation hook inside App.js and that's where I set my notification listeners...

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
    console.log('paramsType',typeof params);
//THIS ALSO RETURNS OBJECT
    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
  }
};

So why are my route params being converted to string type after navigating with navigationRef?

0 likes
0 replies

Please or to participate in this conversation.