Передача данных асинхронного хранилища для реагирования компонента панели навигации
У меня есть некоторые данные профиля, такие как имя, адрес электронной почты и номер мобильного телефона, в моем ящике приложений в моем собственном приложении реакции. Я хочу передать данные в компонент настраиваемого ящика приложений, когда пользователь входит в систему из асинхронного хранилища. В основном проблема заключается в передаче данных асинхронного хранилища функциональному компоненту.
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 />
}
}Как я могу передать имя пользователя, адрес электронной почты и т. д. В этот компонент ящика? Это мой вопрос.
Зачем вам нужно передавать данные в настраиваемое содержимое ящика .... У вас может быть доступ к хранилищу в своем ящике
Можете ли вы показать мне, как я могу передать данные в компонент выдвижного ящика, получив доступ к хранилищу ящика? @Sarmad
Вы используете AsyncStorage?
Да я @Sarmad
Ответы 1
Вы можете использовать componentDidMount в компоненте customDrawerContentComponent и получать данные пользователя из asyncStorage, например
async componentDidMount(){
const user = await AsyncStroage.getItem('user);
this.setState({ user });
}
тогда вы можете использовать состояние в своем методе рендеринга
Какой у Вас вопрос?