Categories
JavaScript Answers React Native Answers

How to open a URL in default web browser with React Native?

Spread the love

Sometimes, we want to open a URL in default web browser with React Native.

In this article, we’ll look at how to open a URL in default web browser with React Native.

How to open a URL in default web browser with React Native?

To open a URL in default web browser with React Native, we can use the Linking.openURL method.

For instance, we write:

import * as React from 'react';
import { View, Text, Linking } from 'react-native';

import { Card } from 'react-native-paper';

const App = () => {
  const onPress = async () => {
    const url = 'https://example.com';
    await Linking.canOpenURL(url);
    Linking.openURL(url);
  };

  return (
    <View>
      <Text onPress={onPress}>open</Text>
    </View>
  );
};
export default App;

to define the onPress function that calls Linking.canOpenURL to check if the url can be opened.

If it resolves to true, then we call Linking.openURL with the url to open the link in the default browser of the device.

Conclusion

To open a URL in default web browser with React Native, we can use the Linking.openURL method.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published. Required fields are marked *