с использованием screeProp
- не рекомендуется react navigation v3
Я полагаю, что больше не рекомендуется помещать навигацию, например TabNavigator, в компонент. Я не совсем уверен, как правильно обрабатывать такие случаи в V3. Недавно я захотел перейти с V1 на V3 и разочаровался в обновлении, так как не мог найти достаточно информации о том, что делать с моими вложенными навигаторами.
другая идея от esipavicius
не переносить экраны в навигатор стека, в который входит навигатор с вкладками. Может быть, вы можете использовать navigationAction
setState
или setParams
с клавишами params
и navigator
. Когда вы можете dispatch
это. И автоматически изменяет состояние с помощью параметров, на которые вы отправили scren.
ВАРИАНТ 1 - ИСПОЛЬЗОВАНИЕ ЭКРАНА PROP
Ваш выбор пропуская экранные реквизиты
class App extends React.Component {
componentDidMount = () => {
this.setState({ someData: 'some data', otherData: 'other data' });
};
render = () => {
return (
<Authenticator>
<AppContainer
screenProps={{ myProp: "test" }}
/>
</Authenticator>
);
};
}
ВАРИАНТ 2 - ИСПОЛЬЗОВАНИЕ API РЕАКТИВНОГО КОНТЕКСТА
Использование API-интерфейса Context и его обертывание вокруг <AppContainer>
.
class App extends React.Component {
render = () => {
return (
<FormContext.Provider value={this.state}>
<AppContainer />
</FormContext.Provider>
);
};
}
Затем потребляйте его на каждом из ваших экранов.
class FirstTabScreen extends React.Component {
render(){
return(
<FormContext.Consumer>
{ (context) => (
// your logic
)}
</FormContext.Consumer>
};
}
Вариант 3 - TAB NAVIGATOR OBJECT
Вы можете передать TabNavigatorObject
createBottomTabNavigator(RouteConfigs, BottomTabNavigatorConfig);
Вы можете передать дополнительную опцию BottomTabNavigator
в BottomTabNavigatorConfig
.
const BottomTabNavigator = StackNavigator(routesConfig, BottomTabNavigatorConfig)
BottomTabNavigatorConfig - это опция, и вы можете проверить api docs
{ initialRouteName: 'Home', navigationOptions: .... }
Вариант 4 - ПОЛУЧИТЬ ПАРАМ ОТ РОДИТЕЛЯ
как объяснено на github и в api docs , вы можете получить родительский компонент и затем использовать getParam
.
const parent = navigation.dangerouslyGetParent();
const yourParam = parent.getParam('yourParamName', 'default value')
Вы можете найти много дискуссий о прохождении реквизита с помощью навигатора вкладок на github