#reactjs #react-native #expo #react-navigation #react-navigation-stack
#reactjs #react-native #выставка #react-навигация #react-navigation-stack
Вопрос:
Я написал <Wizard>
и <Router>
компонент с react-navigation вот так:
generateNavigator = () => {
const { steps, title, onSave, loggedIn } = this.props;
const navigationRoutes = {};
steps.forEach((step, index) => {
const routeOptions = {
screen: step.component,
params: {
bg: step.bg,
text: step.text,
image: step.image,
onSave: onSave,
loggedIn: loggedIn
}
};
navigationRoutes[step.routeName] = routeOptions;
});
const navigationOptions = {
headerStyle: {
backgroundColor: '#ffffff',
paddingHorizontal: 5,
},
headerTintColor: '#111111',
headerTitle: title,
};
const Stack = createStackNavigator(navigationRoutes, { navigationOptions });
const AppContainer = createAppContainer(Stack);
return AppContainer
}
OnSave — это функция в основном App.js а LoggedIn — это состояние из основного App.js (OnSave — это функция для изменения bool-значения LoggedIn)
Функция работает, но только <Router>
и <Wizard>
получает обновление реквизита. Дочерние компоненты, формирующие стек навигации, получают только начальное значение и не обновляют свои реквизиты до измененного состояния с App.js
Я пробовал это в моем App.js OnSave()-Функция:
_onSave = (navigation) => {
console.log(navigation);
navigation.setParams({
loggedIn:
navigation.state.params.loggedIn === false ? true : false
});
this.state.loggedIn === false ? this.setState({ loggedIn: true }) : this.setState({ loggedIn: false });
}
Это правильно устанавливает параметр, но если я вернусь с экрана или перейду дальше и снова перейду к экрану входа в систему, состояние вернется к false, и мне придется снова войти в систему.
Как я могу сохранить состояние «LoggedIn» и для экранов навигации?
В настоящее время нет реальной логики входа в систему, просто щелчок кнопкой мыши в виде clickdummy, подобный этому:
<Button
style={styles.marginButton}
onPress={() => {
onSave(navigation);
}}
>
Оба <Wizard>
и <Router>
имеют правильное текущее состояние LoggedIn (false перед нажатием кнопки и true после нажатия кнопки — даже если я перемещаюсь). Просто параметры экранного компонента остаются, пока я не уйду с экрана входа в систему. После этого он возвращается в исходное состояние.
Я думаю, проблема в том, что после создания навигатора начальное состояние остается таким, какое оно есть, или, может быть, компоненты навигации не перезаписываются?…
Мне нужен способ изменить и сохранить параметр, даже если я перейду на другой экран.
Закуска на выставке:https://snack.expo.io/0RQU64li_
Комментарии:
1. не могли бы вы загрузить пример codesandbox?
2. еще раз обновил ссылку, извините: snack.expo.io/0RQU64li_
3.
generateNavigator
вызывается в конструкторе, что означает, что он запускается один раз. и именно здесь ваши реквизиты перестают распространяться4. может быть, попробуйте следовать reactnavigation.org/docs/auth-flow
5. Куда я должен поместить generateNavigator(), чтобы обновить его значения из state-change?