内でネストされたナビゲーターを私は私が勝ったなど、私がログイン状態のようなものを追跡するために必要な主な理由は、私はReduxのコンテナのための私の定期的な反応-nagivationのセットアップを交換する必要があることリアクトネイティブReduxの
を決めましたそれが私の最初の反応ナビゲーションであるので、それを還元することは混乱の原因になりますが、私は基本的な構造がうまくいきます。
私が持っているものは、すべての上にStackNavがあり、メイン画面はTabNavです。画面が正常に読み込まれていると、そのトップレベルのStackNavの別の画面に切り替えるアプリケーションの部分が正常に動作しています。私の問題は、TabNav内の第1タブから第2タブに切り替えるときに発生します。 明確にするために、「ホーム」と「マイアカウント」の2つのタブがあります。 タブが切り替わっているが、コンポーネントが適切にレンダリングされていないように、自宅から私のアカウントに切り替えるようになりました。これは、スタイルと一緒にレンダリング機能内にあるものすべてが欠落しています。次に、「ホーム」タブに戻したいときは、タブを切り替えるのではなく、実際にトップレベルのStackNavを切り替えるように画面がスライドします。その上、「ホーム」タブに戻った後、左上隅に「戻る」オプションがあります。使用すると、ホームの「前の」ビューにスライドします。同じタブ。
私はそれを書いている間に混乱していますが、うまくいけば、誰かがその意味を理解できるようになります。ここに私のコードは次のとおりです。
トップレベルスタックナビ設定：
const routeConfiguration = {
Home: { screen: HomeTabsNavigation },
GameList: { screen: GameList },
OfferDetails: { screen: OfferDetails },
}
const stackNavOptions = {
initialRouteName: 'Home',
mode: 'card',
headerMode: 'float',
}
export const StackNavConfig = StackNavigator(routeConfiguration, stackNavOptions);
トップレベルスタックナビゲーションコンポーネント：トップレベルのStackNavの最初の画面のように定義
const mapStateToProps = (state) => {
return {
navigationState: state.stackNav,
}
}
class StackNavigation extends React.Component {
render() {
const { dispatch, navigationState } = this.props
return (
<StackNavConfig
navigation={
addNavigationHelpers({
dispatch,
state: navigationState,
})
}
/>
)
}
}
export default connect(mapStateToProps)(StackNavigation)
HomeTabs：
const HomeTabs = TabNavigator({
Home: { screen: HomeView },
MyAccount: { screen: MyAccountView },
}, {
tabBarOptions: tabBarOptions,
});
export default HomeTabs;
ホームタブコンポーネント：
const mapStateToProps = (state) => {
return {
navigationState: state.homeTabs,
}
}
class HomeTabsNavigation extends Component {
render() {
const { navigationState, dispatch } = this.props;
return (
<HomeTabs
navigation={
addNavigationHelpers({
dispatch,
state: navigationState,
})
}
/>
);
}
}
export default connect(mapStateToProps)(HomeTabsNavigation);
マイReduxのストア：
const middleware =() => {
return applyMiddleware(createLogger());
}
export default createStore(
combineReducers({
stackNav: (state, action) => StackNavConfig.router.getStateForAction(action, state),
homeTabs: (state, action) => HomeTabs.router.getStateForAction(action, state),
}),
middleware(),
)
それは重要でない限り私TabNavビューはちょうどので、私はそれらをここに入れていないだろう今のテキストが表示され、その後、私はもちろん、コードを更新します。 ヘルプ！ ;）