Not getting route.params when using deep linking

Question

I'm trying to implement Deep Linking on my APP, I'm following expo-cli react-native-navigation documentation about this subject. After basic configuration I can't get params from route.params from any of the links I set.

This is an example of my code

linking.js

import * as Linking from "expo-linking";

const prefix = Linking.createURL("/");

const config = {
  screens: {
    userStartSession: {
      path: "home/:itemInfo",
      parse: { itemInfo: (itemInfo) => `${itemInfo}` },
    },
  },
};

const linking = {
  prefixes: [prefix],
  config,
};

export default linking;

Docs here: https://reactnavigation.org/docs/deep-linking/ And here: https://reactnavigation.org/docs/configuring-links/

Then import linking into Navigation.js

import React from "react";
import linking from "../utils/linking/linking";

export default function Navigation() {

  return (
    <NavigationContainer linking={linking} fallback={<Text>Cargando...</Text>}>
      <Stack.Navigator>
        <Stack.Screen
          name="userStartSession"
          options={{ headerShown: false, headerLeft: null }}
        >
          {(props) => (
            <UserSessionStack
              {...props}
              somePropsHere={somePropsHere}
            />
          )}
        </Stack.Screen>
      </Stack.Navigator>
    </NavigationContainer>
  );
}

UserSessionStack.js

import React, { useState, useEffect } from "react";
import { createStackNavigator } from "@react-navigation/stack";
import { useRoute } from "@react-navigation/native";

const Stack = createStackNavigator();

export default function UserSessionStack(props) {
  const { somePropsHere } = props;
  const route = useRoute();

  console.log(route.params);

  return (
    <Stack.Navigator
      initialRouteName="slide-home"
    >
      <Stack.Screen
        name="slide-home"
        component={SlideHome}
        options={{ headerShown: false }}
      />
    </Stack.Navigator>
  );
}

Then following react-navigation-native I run this comand to test the link

npx uri-scheme open exp://192.168.1.101:19000/--/home/this_is_a_test --ios

Docs here: https://reactnavigation.org/docs/deep-linking/#test-deep-linking-on-ios

As you may see I'm passing "this_is_a_test" as a param to home link, but if I do console.log(route) in userStartSession component, I always get undefined in params

This is the response

Object {
  "key": "userStartSession-CLSUaGx7QkCe8qlrvuvTf",
  "name": "userStartSession",
  "params": undefined,
  "state": Object {
    "index": 0,
    "key": "stack-cyZDx2Q4gdGaZ1dMr2V1Q",
    "routeNames": Array [
      "slide-home",
      "walkthrough-slides",
      "sign-up-invitation",
      "login-form",
      "recover-account-password",
      "sign-up-form",
      "sign-up-payment-form",
      "sign-up-payment-success",
    ],
    "routes": Array [
      Object {
        "key": "sign-up-invitation-SSf39_Tj79VFv34ydou3N",
        "name": "sign-up-invitation",
        "params": undefined,
      },
    ],
    "stale": false,
    "type": "stack",
  },
}

Not getting route.params when using deep linking

0 Answers0