title: react navigation deep linking not working when use Tabs Stack
body: <p>Version:</p>
  <pre><code>&quot;dependencies&quot;: {
    &quot;react-native&quot;: &quot;0.63.4&quot;,
    &quot;@react-navigation/bottom-tabs&quot;: &quot;^5.11.2&quot;,
    &quot;@react-navigation/native&quot;: &quot;^5.8.10&quot;,
    &quot;@react-navigation/stack&quot;: &quot;^5.12.8&quot;,
  }
  </code></pre>
  <p>Test website link <code>test://info_register?token=1111</code> successfully, I can see <code>route.params</code> includes token</p>
  <p>but when I get into my Tabs screen, and try to to use <code>test://setting_register?token=1111</code>, App just open it doesn't navigate to <code>SettingScreen</code> and <code>route.params</code> is undefined</p>
  <p>I take reference from official document <a href="https://reactnavigation.org/docs/5.x/configuring-links" rel="nofollow noreferrer">https://reactnavigation.org/docs/5.x/configuring-links</a></p>
  <p>What is wrong with my deep linking for Tabs ?</p>
  <p>Here is my code:</p>
  <p>index.js</p>
  <pre><code>import * as React from 'react';
  import {NavigationContainer} from '@react-navigation/native';
  
  import LoginStack from './LoginStack';
  
  import Linking from './Linking';
  
  const AppContainer = () =&gt; {
    return (
      &lt;NavigationContainer linking={Linking}&gt;
        &lt;LoginStack /&gt;
      &lt;/NavigationContainer&gt;
    );
  };
  
  export default AppContainer;
  </code></pre>
  <p>Linking.js</p>
  <pre><code>const config = {
    screens: {
      // set config for App init screen
      PersonalInfoScreen: {
        path: 'info_register/',
          parse: {
            token: (token) =&gt; `${token}`,
          },
      },
      // set config for Tabs screen
      Setting: {
        screens: {
          SettingScreen: 'setting_register/:token',
        },
      },
  },
    },
  };
  
  const Linking = {
    prefixes: ['test://'],
    config,
  };
  
  export default Linking;
  </code></pre>
  <p>LoginStack.js</p>
  <pre><code>import * as React from 'react';
  import {useSelector} from 'react-redux';
  import {createStackNavigator} from '@react-navigation/stack';
  
  import LoginScreen from '../screens/Login/LoginScreen';
  import PersonalInfoScreen from '../screens/Login/PersonalInfoScreen';
  import TabStack from './TabStack';
  
  const Stack = createStackNavigator();
  
  const LoginStack = () =&gt; {
    const {uid, userToken} = useSelector((state) =&gt; state.LoginRedux);
  
    const showLoginFlow = uid === '' || userToken === '' ? true : false;
  
    return (
      &lt;Stack.Navigator
        initialRouteName={'LoginScreen'}
        screenOptions={{headerShown: false, gestureEnabled: false}}&gt;
        {showLoginFlow ? (
          &lt;&gt;
            &lt;Stack.Screen name=&quot;LoginScreen&quot; component={LoginScreen} /&gt;
            &lt;Stack.Screen
              name=&quot;PersonalInfoScreen&quot;
              component={PersonalInfoScreen}
            /&gt;
          &lt;/&gt;
        ) : (
          &lt;&gt;
            &lt;Stack.Screen name=&quot;TabStack&quot; component={TabStack} /&gt;
          &lt;/&gt;
        )}}
      &lt;/Stack.Navigator&gt;
    );
  };
  
  export default LoginStack;
  </code></pre>
  <p>TabStack.js</p>
  <pre><code>import {createBottomTabNavigator} from '@react-navigation/bottom-tabs';
  
  const Tab = createBottomTabNavigator();
  
  const TabStack = () =&gt; {
    return (
      &lt;Tab.Navigator
        screenOptions={...mySetting}
        tabBarOptions={...myStyle},
        }}&gt;
        &lt;Tab.Screen name={'Free'} component={FreeStack} /&gt;
        &lt;Tab.Screen name={'Video'} component={VideoStack} /&gt;
        &lt;Tab.Screen name={'News'} component={NewsStack} /&gt;
        &lt;Tab.Screen name={'Consultation'} component={ConsulationStack} /&gt;
        &lt;Tab.Screen name={'Setting'} component={SettingStack} /&gt;
      &lt;/Tab.Navigator&gt;
    );
  };
  
  export default TabStack;
  </code></pre>