Navigated to initial Route after change in redux store state

Viewed 85

whenever I try add item to my cart by changing cart state in redux , it navigate me to initial route 'Home' in stack navigator. I have tried storing navigation parameter in redux state but it does not solve my problem.

stack navigator contain 3 pages Home->menu->detail if at menu page I add some item to redux state then after adding it send back to main page.

Initializing stack navigator

const Homenavigator = ({ navigation, props }) => {
  return (
    <Stack.Navigator>
      <Stack.Screen
        name="Home"
        component={Home}
        options={{
          title: 'UrbanReach',
          headerStyle: { backgroundColor: '#7f89df' },
          headerTintColor: '#ffffff',
          headerRight: (color) => (
            <View style={{ right: 10, flexDirection: 'row', height: 32, bottom: 3 }}>
              <Avatar
                rounded
                icon={{ name: 'shopping-cart' }}
                size={'medium'}
                containerStyle={{ right: 10, bottom: 6 }}
                onPress={() => navigation.navigate('Cart')}
              />
              <Badge
                status="warning"
                containerStyle={{ position: 'absolute', left: 15 }}
                value={this.props.cart.cart.length}
                badgeStyle={{ width: 1, height: 18 }}
              />
            </View>
          ),
        }}
      />
      <Stack.Screen
        name="Search"
        component={Search}
        options={{
          headerStyle: { backgroundColor: '#7f89df' },
        }}
      />

      <Stack.Screen
        name="Menu"
        component={Menu}
        options={{
          headerStyle: { backgroundColor: '#7f89df' },
          headerRight: (color) => (
            <View style={{ right: 10, flexDirection: 'row', height: 32, bottom: 3 }}>
              <Avatar onPress={() => navigation.navigate('Cart')} />
            </View>
          ),
        }}
      />
      <Stack.Screen
        name="Dishdetail"
        component={Dishdetail}
        options={{
          title: 'Cart',
          headerStyle: { backgroundColor: '#7f89df' },
          headerRight: (color) => (
            <View style={{ right: 10, flexDirection: 'row', height: 32, bottom: 3 }}>
              <Avatar
                rounded
                icon={{ name: 'shopping-cart' }}
                size={'medium'}
                containerStyle={{ right: 10, bottom: 6 }}
                onPress={() => navigation.navigate('Cart')}
              />
            </View>
          ),
        }}
      />
    </Stack.Navigator>
  );
};
export const cart = (state = { errMess: null, isLoading: true, cart: [] }, action) => {
  switch (action.type) {
    case ActionTypes.POST_CART:
      return { ...state, errMess: null, isLoading: false, cart: [...state.cart, action.payload] };
    default:
      return state;
  }
};
0 Answers
Related