Передать реквизиты из корневого компонента в AppNavigator - PullRequest
Новая
       11

Передать реквизиты из корневого компонента в AppNavigator

0 голосов
/ 08 июля 2019

У меня есть AppNavigator внутри корневого компонента приложения. Мне нужно изменить initialRouteName в AppNavigator в зависимости от реквизита корневого компонента. В корневом компоненте, когда пользователь входит в систему, я сохраняю учетные данные в связке ключей. И мне нужно сделать так: userLoggedIn? HomeScreen: AuthScreen Подскажите, пожалуйста, как я могу отправить реквизиты userLoggedIn из корневого компонента App в AppNavigator?

App.js: 

import React, { useState, useEffect } from 'react'
import { ApolloProvider } from 'react-apollo'
import { ApolloProvider as ApolloHooksProvider } from 'react-apollo-hooks'
import { ApolloClient } from 'apollo-client'
import { createHttpLink } from 'apollo-link-http'
import { setContext } from 'apollo-link-context'
import { InMemoryCache } from 'apollo-cache-inmemory'
import * as Keychain from 'react-native-keychain'
import AppNavigator from './AppNavigator'

const httpLink = createHttpLink({
  uri: 'http://localhost:4000'
})

const authLink = setContext(async (_, { headers }) => {
  const tokens = await Keychain.getGenericPassword()
  const accessToken = tokens.accessToken
  return {
    headers: {
      ...headers,
      authorization: accessToken ? `Bearer ${accessToken}` : ''
    }
  }
})

const client = new ApolloClient({
  link: authLink.concat(httpLink),
  cache: new InMemoryCache(),
  connectToDevTools: true
})

const App = () => {
  const [loggedIn, setLoggedIn] = useState(false)
  useEffect(async () => {
    const tokens = await Keychain.getGenericPassword()
    const accessToken = tokens.accessToken
    if (accessToken) {
      setLoggedIn(true)
    }
  })
  return (
    <ApolloProvider client={client}>
      <ApolloHooksProvider client={client}>
        <AppNavigator userLoggedIn={loggedIn} />
      </ApolloHooksProvider>
    </ApolloProvider>
  )
}

export default App

AppNavigator.js: 

import { createStackNavigator, createAppContainer } from 'react-navigation'
import { HomeScreen, AuthScreen } from './screens'

const AppNavigator = createStackNavigator(
  {
    AUTH_SCREEN: AuthScreen,
    HOME: HomeScreen
  },
  {
    initialRouteName: 'AUTH_SCREEN',
    headerMode: 'none'
  }
)

export default createAppContainer(AppNavigator)

1 Ответ

1 голос
/ 08 июля 2019

Вы должны использовать переключатель навигатор. https://reactnavigation.org/docs/en/switch-navigator.html#docsNav.

...