传递异步存储数据以响应导航抽屉组件答案

【问题标题】：Passing async storage data to react navigation drawer component传递异步存储数据以响应导航抽屉组件
【发布时间】：2019-01-15 10:53:11
【问题描述】：

我的 React Native 应用程序的应用程序抽屉中有一些个人资料信息数据，例如姓名、电子邮件和手机号码。当用户从异步存储登录时，我想将数据传递给自定义应用程序抽屉组件。基本上问题是将异步存储数据传递给功能组件。

const AppDrawerNavigator = createDrawerNavigator ({
  Home: {
    screen : Maps,
    navigationOptions: () => ({
      title: `Search by`
    })
  },
  Vendor: {
    screen: HomeScreen,
    navigationOptions: () => ({
      title: `Vendor List`,
    })
  },
  Notifications: NotificationsScreen,
  Events: SearchDetails,
  Venue : {
    screen: SearchScreen,
    navigationOptions: () => ({
      title: `Venue Availability`,
    })
  },
  Settings: {
    screen: SettingsScreen
  }
}, {
  drawerPosition: 'left',
  contentComponent: customDrawerContentComponent,
  drawerOpenRoute: 'DrawerOpen',
  drawerCloseRoure: 'DrawerClose',
  drawerToggleRoute: 'DrawerToggle',
  drawerWidth: 320,
  contentOptions: {
    activeTintColor: '#fff',
    inactiveTintColor: '#030303',
    activeBackgroundColor: '#B90066',
    inactiveBackgroundColor: '#fff',
    itemsContainerStyle: {
      marginHorizontal: 10
    },
    itemStyle: {
      height: 40,
      borderRadius: 60,
    },
    activeLabelStyle: {
      fontSize: 20, 
      fontWeight: 'normal'
    }
  }
  })
  
  const AppSwitchNavigator = createSwitchNavigator({
  AuthLoadingScreen: AuthLoadingScreen,
  Auth: AuthStackNavigator,
  App: {
    screen: AppDrawerNavigator
  }
})


const WeTaAppDrawer = createAppContainer(AppSwitchNavigator)

export default class App extends Component {
  render() {
    return <WeTaAppDrawer />
  }
}

【问题讨论】：

你有什么问题？
如何将登录用户名、电子邮件等传递给该抽屉组件？这是我的问题。
为什么需要将数据传递给customDrawerContent....您可以访问抽屉中的存储
你能告诉我如何通过访问抽屉的存储将数据传递给抽屉组件吗？ @Sarmad
你在使用 AsyncStorage 吗？

标签： reactjs react-native

【解决方案1】：

您可以在 customDrawerContentComponent 组件中使用 componentDidMount 并从 asyncStorage 中获取用户数据，例如

async componentDidMount(){
  const user = await AsyncStroage.getItem('user);
  this.setState({ user });
}

然后你可以在你的渲染方法中使用状态

【讨论】：