Реагировать на родной, как добавить нижнюю вкладку меню после нажатия входа - PullRequest
Новая
       89

Реагировать на родной, как добавить нижнюю вкладку меню после нажатия входа

1 голос
/ 02 мая 2020

Я новичок в реакции-нативной, и я запутался в маршрутизации / навигации. По сути, у меня есть 4 экрана: Login, Register, Home и Links. Register и Login уже установлены. Я использовал stackNavigator для того, чтобы пользователь мог щелкнуть назад, хотят ли они зарегистрироваться или нет. Но когда я нажимаю «Войти», я хочу перенаправить пользователя на мой экран Home, в котором есть меню вкладок или контейнер. Мой текущий вывод для этого кода таков: когда я регистрируюсь, я могу go вернуться к логину, нажав на текст, который я сделал. Может ли кто-нибудь показать мне или предоставить мне ссылку на то, как сделать нижнюю вкладку, когда я успешно вошел в систему?

Мой текущий вывод здесь https://imgur.com/a/9lsHCe6

Я использовал onPress={()=>{navigation.navigate('Route')}} функциональность моих компонентов для переключения экрана.

Вот мой код:

AppNavigation. js

import { createStackNavigator } from 'react-navigation-stack'
import Register from '../screens/RegisterScreen'
import Login from '../screens/LoginScreen'

const AppNavigation = createStackNavigator(
  {
    Login: { screen: Login},
    Register: { screen: Register },
  },
  {
    initialRouteName: 'Login',
    headerMode: 'none'
  }
)
export default AppNavigation

AuthNavigation. js

import { createStackNavigator } from 'react-navigation-stack'
import Login from '../screens/LoginScreen'
const AuthNavigation = createStackNavigator(
  {
    Login: { screen: Login },
  },
  {
    initialRouteName: 'Login',
  }
)
export default AuthNavigation

index. js (внутри ./navigation/index.js)

import { createSwitchNavigator, createAppContainer } from 'react-navigation'
import AuthNavigation from './AppNavigation'
import AppNavigation from './AppNavigation'

const SwitchNavigator = createSwitchNavigator(
  {
    Auth: AuthNavigation,
    App: AppNavigation
  },
  {
    initialRouteName: 'Auth',
  }
)
const AppContainer = createAppContainer(SwitchNavigator)
export default AppContainer

Приложение. js

export default function App() {
    return (
      <AppContainer />
    );
  }
}

My текущий каталог

enter image description here

Я следовал схеме авторизации здесь https://heartbeat.fritz.ai/how-authentication-flow-works-in-react-native-apps-using-react-navigation-4-x-a30bb4d9e5d6

1 Ответ

1 голос
/ 03 мая 2020

попробуйте этот синтаксис на onPress 

onPress={()=> this.props.navigation.navigate('Register')}

ваш вопрос: как сделать нижнюю вкладку, когда я успешно вошел в систему?

создать Домашний Компонент

При успешном входе в систему, тогда 

if(login is successfully){
  this.props.navigation.navigate('Home');
}
...