¿Cómo agregar el botón Compartir en React Native?

React Native es un marco de software de interfaz de usuario de código abierto creado por Meta Platforms, Inc. Se utiliza para desarrollar aplicaciones para Android, Android TV, iOS, macOS, tvOS, Web, Windows y UWP al permitir que los desarrolladores usen el marco React junto con con capacidades de plataforma nativa.

En este artículo, aprenderemos cómo podemos agregar un botón para compartir en React Native.

Creación de la aplicación React Native: 

Paso 1: usaremos expo para crear la aplicación nativa de reacción. Instale expo-cli usando el siguiente comando en la terminal.

npm install -g expo-cli

Paso 2: Cree un proyecto nativo de reacción usando expo.

expo init "gfg"

Paso 3: Ahora ve al proyecto creado usando el siguiente comando.

cd "gfg"

Estructura del proyecto: Tendrá el siguiente aspecto:

Ejemplo: 

  • Agregar un botón para compartir: puede agregar fácilmente un botón para compartir en su aplicación nativa de reacción usando la API para compartir. Para esto, agregue el siguiente código dentro del archivo App.js.

Javascript

import React from "react";
import { Share, View, Button, Text } from "react-native";
  
const GfGApp = () => {
    const shareData = async () => {
        try {
            await Share.share({
                message:
                    'This is the demo text',
            });
        } catch (error) {
            alert(error.message);
        }
    };
    return (
        <View style={{ marginTop: 80 }}>
            <Text style={{ fontSize: 18 }}>
                GeeksforGeeks React Native Share</Text>
            <Button onPress={shareData} title="Share" />
        </View>
    );
};
  
export default GfGApp;

Aquí estamos usando la función de compartir del módulo Compartir para agregar el botón de compartir en la aplicación.

Ejecute la aplicación: Ahora ejecute la aplicación usando el siguiente comando en la terminal.

npm run web

Producción:

Publicación traducida automáticamente

Artículo escrito por imranalam21510 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *