2017-10-26 3 views
0

redux가 내비게이션 상태를 저장할 때 내비게이션이 어떻게 발생하는지 알고 싶습니다.React Navigation redux navigate

짧은 버전 :

REDUX 저장소가 초기 상태에 있지 않은 경우, 화면은 실제로이 navigationg없이 장착됩니다.

자세한 설명 :

가 지금은 하나 (1) (내 경우에는 StackNavigator) 부모 네비게이터 에 의해 주어진 탐색 소품을 사용하거나 (2) 파견 작용에 의해 탐색 할 수 있어요 .

1 : this.props.navigation.navigate('main')

2 : this.props.navigateToMainAction()

감속기 :

const INIT_STATE = Nav.router.getStateForAction(
    NavigationActions.navigate({ routeName: 'login' }) 
); 
const navReducer = (state = INIT_STATE, action) => { 
    const newState = Nav.router.getStateForAction(action, state); 
    return newState || state; 
}; 

탐색 구조 :

const authStack = StackNavigator({ 
    login: { screen: LoginScreen } 
    ,forgottendPassword: { screen: LoginScreen } 
}, { 
    initialRouteName: 'login' 
    ,headerMode: 'none' 
}); 

const homeDrawer = DrawerNavigator({ 
    home: { 
     screen: HomeScreen 
     ,navigationOptions: { drawerLockMode: 'locked-closed' } 
    } 
}, { 
    drawerPosition: 'right' 
    ,drawerWidth: 300 
    ,contentComponent: props => <HomeDrawerMenu {...props} /> 
}); 

const mainStack = StackNavigator({ 
    homeDrawer: { 
     screen: homeDrawer 
     ,navigationOptions: ({ navigation }) => ({ 
      header: <HomeMenu navigate={navigation.navigate} /> 
     }) 
    } 
    ,partnerList: { 
     screen: PartnerListScreen 
     ,navigationOptions: ({ navigation }) => ({ 
      header: <PartnerListMenu navigation={navigation} /> 
     }) 
    } 
}, { 
    initialRouteName: 'homeDrawer' 
}); 

const Nav = StackNavigator({ 
    auth: { screen: authStack } 
    ,main: { screen: mainStack } 
}, { 
    initialRouteName: 'auth', 
    headerMode: 'none', 
}); 

내가 main에 거기에서 auth/login에서 이동하려고 main/partnerList redux 저장소가 초기 상태 인 경우 (비동기 저장을 지운 후에) 만 올바르게 작동합니다..

그러나 앱을 다시로드하면 실제로 이동하지 않고 main/partnerList 구성 요소가 탑재됩니다. 그 덕분에 partnerList comp.의 데이터를 가져 오는 작업도 호출됩니다. 부하에

예상 동작 순서 : 부하에

@@INIT 
Offline/STATUS_CHANGED 
persist/REHYDRATE 
check_token <- Check if the user is logged in (in this case he is) 
check_token_commit 
Navigation/NAVIGATE <- The user is forwarded to main, when he is logged in 
Navigation/NAVIGATE <- The user goes to the partnerList component 
fetch_partner_list <- Action for fetching the partner list 
Offline/BUSY 
fetch_partner_list_commit 

현재 작업 순서는 :

@@INIT 
Offline/STATUS_CHANGED 
persist/REHYDRATE 
check_token <- Check if the user is logged in (in this case he is) 
fetch_partner_list <- It's already fetching, but no navigate action was triggered yet 
Offline/BUSY 
check_token_commit 
Navigation/NAVIGATE <- The user is forwarded to main, when he is logged in 
Navigation/NAVIGATE <- The forwarding happens twice, for some reason 
fetch_partner_list_commit 
Navigation/NAVIGATE <- The user goes to the partnerList component 
fetch_partner_list <- The only time it should be triggered 
Offline/BUSY 
fetch_partner_list_commit 

답변

0

문제는 반응 탐색의 부적절한 사용으로 coused했다.

나는 auth와 메인 라우터를 감싸고 screen 네비게이션을 뿌리 내야 만했다.