Я читал бесчисленные документы по интерактивной навигации, и я знаю, что есть способ сделать это, но это определенно то, что я бы назвал нетривиальным и определенно неинтуитивным.
У меня есть корневой навигационный стек:
export const NavigationStack = StackNavigator({
Splash: {
screen: Splash
},
Signup: {
screen: Signup
},
Login: {
screen: SignIn
},
ForgottenPassword: {
screen: ForgottenPassword
},
Discover: {
screen: Discover
},
ProfileShow: {
screen: ProfileShow
}
}, {
headerMode: 'none'
})
Экран ForgottenPassword - это дочерний Stack Navigator:
import { StackNavigator } from 'react-navigation'
import PasswordResetProcess from './index'
const ForgottenPassword = StackNavigator({
ResetPassword: {
screen: PasswordResetProcess
}
}, {
headerMode: 'none'
})
export default ForgottenPassword
В этом компоненте компонента index.js
Container есть подкомпонент, к которому я index.js
навигацию, например:
switch (lastCompletedStep) {
case NEW_RESET_REQUEST:
return <InputTel navigation={navigation} />
case INPUT_TEL:
return <ResetPassword navigation={navigation} />
Этот компонент ResetPassword
является тем, о котором идет речь. Он запускает создателя действия и передает this.props.navigation
в создателя действия:
await props.handleResetSubmit(token, props.navigation)
Изнутри этого создателя действия, props.navigation
доступен как navigation
. Я могу сделать это хорошо:
navigation.navigate('Discover') // see how this is from the root Navigation Stack
Однако я не могу этого сделать:
navigation.dispatch({
type: 'Navigation/RESET',
index: 0,
actions: [{ type: 'Navigate', routeName: 'Discover' }]
})
Это порождает эту ошибку:
[править] Я просто попробовал это, и он также сгенерировал ту же ошибку:
navigation.dispatch(NavigationActions.reset({
index: 0,
actions: [NavigationActions.navigate({ routeName: 'Discover' })]
}))
Как сбросить стек во время навигации, чтобы
Discover
здесь?
Я чувствую, что ответ заключается в том, чтобы перейти к обнаружению и сбросу стека одновременно с какой-то дочерней операцией, но я не знаю, с чего начать это вместе. Документация по react-navigation
является ужасающей для иллюстрации операций родительских операций с родителями.
Вот моя лучшая догадка о том, как это примерно должно выглядеть:
navigation.dispatch({
type: 'Navigation/NAVIGATE',
routeName: 'Discover',
actions: [{ type: 'Reset', index: 0, key: null }]
})
Я просто решил это с помощью этого кода:
navigation.dispatch(NavigationActions.reset({
index: 0,
key: null,
actions: [NavigationActions.navigate({ routeName: 'Discover' })]
}))
Секрет заключался в том, чтобы добавить key: null
, который я видел раньше. Это очень важный элемент в моменты, когда вы перезагружаетесь.
Вот документация, которую я нашел, которая иллюстрирует это:
https://github.com/react-community/react-navigation/issues/1127
Я думаю, что это работает, потому что NavigationActions
обладает знаниями о корневом стеке навигации, поэтому он работает по той же причине, что и работа с navigation.navigate('Discover')
(в контексте моего кода в этом вопросе).