Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6287

Im trying to goBack to the root screen on my react native app but i cant, i have a lot of errors trying different things

$
0
0

I want to return to th login screen or just return all like when the app is oppened, i tried to use navigation.popToTop but it drop an error like popToTop was not handled by any navigator.The objective is just return to the login screen, its just for the logout function

import React from 'react';import { createStackNavigator } from '@react-navigation/stack';import MenuScreen from '../screens/MenuScreen/index'import AddProductScreen from '../screens/AddProductScreen/AddProductScreen';import Router from '.';import LoginStack from './LoginStack';const Stack = createStackNavigator();const Root = createStackNavigator();const NewProductStack = () => {    return (                    <Stack.Navigator><Stack.Screen component={MenuScreen} name="MenuScreen" options={{title:"Menú"}}/><Stack.Screen component={AddProductScreen} name="AddProductScreen" options={{title:"Nuevo producto"}}/>                                    </Stack.Navigator>                        );};export default NewProductStack;

Here is my stack code from my menu screen

import React from 'react'import { View, Text, SafeAreaView, Button, StyleSheet, TouchableOpacity } from 'react-native'import Firebase from '../../../config/firebase';import {useNavigation, StackActions } from '@react-navigation/native';import { AntDesign } from '@expo/vector-icons';import { FontAwesome } from '@expo/vector-icons';import firebase from "firebase";const MenuScreen = () => {    const navigation = useNavigation();            const onLogout=()=>{        firebase.auth().signOut().then(() => {                    alert('Cerrar sesión')                                    }).catch((error) => {            alert("No se pudo cerrar sesión")            console.log(error)          });    }    const newPr=()=>{        navigation.navigate('AddProductScreen')    }    return (<SafeAreaView style={styles.container}>             <TouchableOpacity style={styles.button} onPress={onLogout}><AntDesign name="logout" size={24} color="black" /><Text style={styles.buttonText}>Cerrar Sesión</Text></TouchableOpacity><TouchableOpacity style={styles.button} onPress={newPr}><FontAwesome name="money" size={24} color="black" /><Text style={styles.buttonText}>Vender un Producto</Text></TouchableOpacity>            </SafeAreaView>    )}const styles = StyleSheet.create({    container: {        padding:10,        flex: 1,        backgroundColor: '#fff',        alignItems: 'baseline'    },        button: {        flexDirection:'row',        marginLeft:20,        marginTop:20,        borderColor: '#d3d3d3',        borderBottomWidth: 1,    },    buttonText: {        marginLeft:10,        fontSize: 20,        fontWeight: 'bold',        color: '#000000'    },    buttonSignup: {        fontSize: 12    }})export default MenuScreen;

Here is my Menu code

import React from 'react';import { NavigationContainer, StackActions } from '@react-navigation/native';import { createStackNavigator } from '@react-navigation/stack';import LoginStack from '../router/LoginStack';const Root = createStackNavigator();const Router = () => {    return (<NavigationContainer><Root.Navigator screenOptions={{headerShown: false}}><Root.Screen component={LoginStack} name="LoginStack"/></Root.Navigator></NavigationContainer>    );};export default Router;

Here is where I want to come

import React from 'react'import Router from './src/router/index'export default class App extends React.Component {    render() {        return <Router/>    }};

Here is my app code


Viewing all articles
Browse latest Browse all 6287

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>