Trabajando en React-Native por primera vez y usando un llavero para la página de inicio de sesión donde obtuve este problema.
import React, { useEffect, useState } from "react"; import { StyleSheet, Text, TextInput, View, Dimensions } from "react-native"; import * as Keychain from "react-native-keychain"; export default function App() { const [isLoggedIn, setIsLoggedIn] = useState(false); const [userDetails, setUserDetails] = useState({}); useEffect(() => { (async () => { try { const credentials = await Keychain.getGenericPassword(); if (credentials) { setIsLoggedIn(true); setUserDetails(credentials); } else { console.log("No credentials stored"); } } catch (error) { console.log("Keychain couldn't be accessed!", error); } })(); }, []); const handleLogin = async () => { // login api call here const username = "Shivam"; const password = "shivam"; await Keychain.setGenericPassword(username, password); setIsLoggedIn(true); setUserDetails({password, username}); }; const handleLogout = async()=>{ const logout = await Keychain.resetGenericPassword(); console.log({logout}); if(logout){ setIsLoggedIn(false); setUserDetails({}); } } return ( <View style={styles.container}> {!isLoggedIn ? ( <View> <Text style={styles.helloText}>Hello Tayze User!</Text> <TextInput placeholder="email" style={styles.textInput} /> <TextInput placeholder="password" secureTextEntry style={styles.textInput} /> <Text style={styles.loginBtn} onPress={handleLogin}> Login </Text> </View> ) : ( <View> <Text style={styles.welcomeText}> Welcome back! {userDetails} </Text> <Text style={styles.logoutBtn} onPress={handleLogout} >Logout</Text> </View> )} </View> ); } const screenWidth = Dimensions.get("screen").width;Recibo el siguiente error:
Posible rechazo de promesa no manejado (id: 0: solicitud de red fallida)
Aquí está el código de promesa, no veo qué está mal aquí, ¿alguna idea? Este código configura al usuario durante el inicio de sesión y accede a la página de inicio donde se mostrará el nombre de usuario y un botón de cierre de sesión
El Possible unhandled promise rejection no manejado significa que se produjo un error en parte de su código asincrónico y el error no se manejó.
Para manejar los errores en los métodos asincrónicos, debe envolverlos en bloques try/catch:
const handleLogin = async () => { const username = "Shivam"; const password = "shivam"; try { await Keychain.setGenericPassword(username, password); setIsLoggedIn(true); setUserDetails({password, username}); } catch (err) { console.log('Login failed', err); } }; const handleLogout = async () => { try { const logout = await Keychain.resetGenericPassword(); setIsLoggedIn(false); setUserDetails({}); } catch (err) { console.log('Logout failed', err); } };En este caso, el error que se genera es un error de red. Puede consultar la pestaña de red de las herramientas de desarrollo de su navegador para ver qué está sucediendo.