как перейти с экрана на App.js к первому экрану в React-Native

#react-native

Вопрос:

Прежде всего, извините за этот очень обычный вопрос. Я новичок в React-Native.

Я использовал навигацию в приложении, и я просто добавляю правую кнопку на панели навигации для выхода из App.js . этот код:

 import React from 'react';
import { StyleSheet, Text, View,SafeAreaView, ScrollView,Button,Alert} from 'react-native';
import PresentationalComponent from './PresentationalComponent'
import List from './List.js'
import Login from './Login.js'
import SignUp from './SignUp.js'
import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';
import { useRoute } from '@react-navigation/native';
const Stack = createStackNavigator();
class App extends React.Component {

constructor(props) {
 super(props);
}
logOutAction(){
  Alert.alert('Done!','Are you sure you want to log-out?',
      [{text: 'Cancel'},{text : 'Yes',onPress: this.done}]
      )
}
done(){
//alert(List.props.navigation.state.routeName)
}
render() {
  return (
  <NavigationContainer>
  <Stack.Navigator>
    <Stack.Screen name="Login" component={Login} options={{ title: 'Log-In' }} />
    <Stack.Screen name="SignUp" component={SignUp} options={{ title: 'Sign-Up'}} />
    <Stack.Screen name="List" component={List} options={{ headerLeft:null, headerRight: () => (
        <Button
          onPress={() => this.logOutAction()}
          title="Log-Out"
          color="#000"
        />
      ) } }/>
  </Stack.Navigator>
 </NavigationContainer>
  );
  }
}
export default App;

Мое действие кнопки выхода из системы существует в App.js класс. Как запустить приложение с Login.js когда я нажимаю на кнопку выхода из системы?

1. Как вы управляете входом в систему? вы должны условно отображать стек на основе статуса входа в систему, проверьте это reactnavigation.org/docs/auth-flow

2. @GuruparanGiritharan спасибо, пользователь может войти в систему с экрана входа в систему, после успешного входа пользователя в систему он переходит к экрану списка. И из App.js Я добавил кнопку «Выход из системы» в правой части навигации на экране списка. Итак, теперь, когда пользователь нажимает на эту кнопку, и ее действие существует в app.js класс итак, как я могу перемещаться по экрану входа в систему

3. Пожалуйста, проверьте мой ответ

4. Проверка того же братана

Ответ №1:

Чтобы получить доступ к навигации с помощью кнопки заголовка, вам нужно сделать, как показано ниже

 <Stack.Screen name="List" component={List} options={({navigation})=>({ headerLeft:null, headerRight: () => (
        <Button
          onPress={() => this.logOutAction(navigation)}
          title="Log-Out"
          color="#000"
        />
      )})}/>

Таким образом, logoutAction будет иметь доступ к навигации, которую вы можете использовать

 logOutAction(navigation){
  Alert.alert('Done!','Are you sure you want to log-out?',
      [{text: 'Cancel'},{text : 'Yes',onPress:()=> this.done(navigation)}]
      )
}
done(navigation){
  navigation.navigate('Login');
}