React native Link to another application

Question

I am trying to connect to another application from my own native application (e.g. google maps).

I need a Linking module, as it was written here: https://facebook.imtqy.com/react-native/docs/linking.html

My code contains a simple button that should open the navigation application and pass any location as properties:

<TouchableOpacity onPress={ () =>{ Linking.openURL("http://maps.google.com/maps=daddr=Wien") .catch(err => console.error('An error occurred', err)); }} > <Text>Navigate</Text> </TouchableOpacity> 

When loading a view, I get no errors that imply that the module needs to work fine.

When you click on the button, the following error message appears:

 undefined is not an object (evaluating '_reactNative.Linking.openURL') 

---

I followed these steps: https://facebook.imtqy.com/react-native/docs/linking-libraries-ios.html and installed npm install link --save <- Maybe the problem is that this is the wrong module? ? If this is not true, does anyone know the name of the correct one?

Answer 1

You do not need npm install link --save or use the Link Libraries in iOS ". The components" <Linking /> "and" Link the action of librairies "are two different things.

<Linking /> is a component that allows you to open links (web links or links to other applications) and determine when your application is called from a link (from a browser or other application, or a push notification, for example). It is a core component of React Native, and comes with a reaction-based npm package.

Linking librairies is necessary when installing a third-party library (for example, react-native-maps ) and you need to add dependencies to the iOS Xcode and Android Gradle build configurations. This is usually done using the react-native link <package> command after npm install .

The only thing you have to do is require or import <Linking /> into your javascript file before using it. You do not even need complete information about Processing deep links from the documentation. This is only for inbound links that open your application. All you need starts with Opening External Links

Now, why your code crashes is a mystery. Here is a link to a working application with the same behavior. A brief example:

 import React from 'react'; import { TouchableOpacity, Linking, Text } from 'react-native'; export default function Button() { return ( <TouchableOpacity onPress={() => Linking.openURL('https://maps.google.com?q=stack+overflow+offices')}> <Text>Press me</Text> </TouchableOpacity> ); } 

You can also test it here on rnplay .

I suggest cleaning up the project by deleting the node_modules folder and making npm install again and compiling your project with a new one.