How to use Deep-linking in React Native?

Asked

Viewed 281 times

3

How to pass a URL in this format https://www.google.co.uk/? code=3a549132-8966-4ae1-a951-7e873452df3c&state=febe0bc9-8b38-4a78-a122-7e36c398a14a by the browser in a way that opens the application and shows the parameters code and state?

I did it that way but he’s not showing me code and state

App.tsx

import 'react-native-gesture-handler';

import React from 'react';
import { View, StatusBar, Platform } from 'react-native';
import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';

import Routes from './routes';

import Home from './pages/Home';

const App: React.FC = () => {
  const prefix = {
    prefixes: ['https://google.co.uk'],
    config: {
      screens: {
        Home: {
          screen: Home,
          path: '/:code/:state',
        }
      }
    }
  };

  return (
    <NavigationContainer linking={prefix}>
      <StatusBar barStyle="dark-content" backgroundColor="#DDD" />
      <View style={{ flex: 1, backgroundColor: '#DDD' }}>
        <Routes />
      </View>
    </NavigationContainer>
  );
};

export default App;

Home/index.tsx

import React, { useEffect } from 'react';
import { Text } from 'react-native';
import { Container } from './styles';

const Home: React.FC = ({ route }) => {
  useEffect(() => {
    // para testar
    console.log('ROUTE: ', route)
  }, [route]);

  return (
    <Container>
      <Text>Pagina Home</Text>
    </Container>
  );
};

export default Home;

Androidmanifest.xml

<intent-filter>
  <action android:name="android.intent.action.VIEW" />
  <category android:name="android.intent.category.DEFAULT" />
  <category android:name="android.intent.category.BROWSABLE" />
  <data android:scheme="https" android:host="*.google.co.uk" />
</intent-filter>
react-native

1 answer

-3

Browser other questions tagged react-native

You are not signed in. Login or sign up in order to post.