¿Cómo verificar los detalles de la plataforma y el dispositivo 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 verificar los detalles de la plataforma y el dispositivo 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:

Comprobación del sistema operativo y la versión: podemos comprobar fácilmente el sistema operativo y la versión del dispositivo que está utilizando el usuario. Para ello, vamos a utilizar la API de plataforma de react-native. 

Ejemplo:  agregue el siguiente código en el archivo App.js.

Javascript

import React from "react";
import { Platform, View, Text } from "react-native";
  
const GfGApp = () => {
  
    return (
        <View style={{ marginTop: 80 }}>
            <Text style={{ fontSize: 18 }}>
                GeeksforGeeks React Native Platform</Text>
            <Text style={{ fontSize: 18 }}>
                OS:- {Platform.OS}</Text>
            <Text style={{ fontSize: 18 }}>
                Version:- {Platform.Version}</Text>
        </View>
    );
};
  
export default GfGApp;

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

npm run web

Producción:

 

Comprobación de la información del dispositivo: podemos comprobar fácilmente la información del dispositivo que está utilizando el usuario. Para ello, vamos a utilizar la API de plataforma de react-native. 

Ejemplo:  agregue el siguiente código en el archivo App.js.

Javascript

import React from "react";
import { Platform, View, Text } from "react-native";
  
const GfGApp = () => {
  
    return (
        <View style={{ marginTop: 80 }}>
            <Text style={{ fontSize: 18 }}>
                GeeksforGeeks React Native Platform
            </Text>
            <Text style={{ fontSize: 18 }}>
                Constants:- {JSON.stringify(Platform.constants, null, 2)}
            </Text>
        </View>
    );
};
  
export default GfGApp;

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 *