Как передать учетные данные для входа на первый экран DrawerMenu панели навигации в React Native?

Question

Я создал React-navigation Drawer V3 в своем приложении.Я сталкиваюсь с проблемой получения учетных данных для входа в систему на начальном экране, который является "домашним" экраном моего стека навигации ящика.Хотя я передаю данные на DrawerMenu.js из Login.js с помощью:

this.props.navigation.navigate('DrawerMenu', {
    loginData: loginData
})

и получаю данные на DrawerMenu.js с помощью:

constructor(props) {
    super(props)
    this.state = {
      loginData: props.navigation.state.params.loginData
    }
  }

Но мне нужночтобы получить эти данные в Home.js, которые я не могу получить.Причиной получения данных в DrawerMenu.js было то, что в стеке есть несколько других экранов, которые хотят получить logindata, и они могут получить его, используя screenProps, используемый в компоненте содержимого ящика, но поскольку Home является начальным экраном, то нет никакого способа, которымон получает данные в первый раз, только файл DrawerMenu.js получает их изначально.Может ли кто-нибудь помочь мне в этом?

Вот мой код DrawerMenu со стеком навигации.

class DrawerMenu extends Component {

  constructor(props) {
    super(props)
    this.state = {
      loginData: props.navigation.state.params.loginData
    }
  }


  static navigationOptions =
    {
      header: null,
    };

  render() {
    return (
      <SafeAreaView style={styles.droidSafeArea}>
        <MyApp screenProps={{ loginData: this.state.loginData}} />
      </SafeAreaView>
    )
  }
}

class Hidden extends React.Component {
  render() {
    return null;
  }
}


const MainScreenNavigator = createStackNavigator({

  Home: { screen: Home },
  Screen1: {
    screen: Screen1
  },
  Screen2: {
    screen: Screen2
  },
  Screen3: {
    screen: Screen3
  }
},
  {
    initialRouteName: 'Home',
  });

const MyDrawerNavigator = createDrawerNavigator(
  {
    Main: {
      screen: MainScreenNavigator,
      navigationOptions: {
        drawerLabel: <Hidden />
      }
    }
  },
  {
    drawerWidth: 300,

    contentComponent: DrawerComponent
});

const MyApp = createAppContainer(MyDrawerNavigator);

export default DrawerMenu;

Я использую:

"react-native" : "0.57.5",
 "react": "16.6.1",
 "react-navigation": "^3.5.1"

Answer 1

Вы можете использовать AsyncStorage для сохранения данных Для хранения

_storeData = async () => {
  try {
    await AsyncStorage.setItem('Key Value', 'Item Value');
  } catch (error) {
    // Error saving data
  }
};

Для извлечения

_retrieveData = async () => {
  try {
    const value = await AsyncStorage.getItem('Key Value');
    if (value !== null) {
      // We have data!!
      console.log(value);
    }
  } catch (error) {
    // Error retrieving data
  }
};

Или вы можетеиспользуйте redux.