反应导航,用嵌套导航返回

Stack Navigator :
 - Login
 - Register
 - Activation
 - Tab Navigator
    + Home
    + Histories
    + Cart
    + Profile
 - Outlet
 - Product

我有一个问题,当我在产品界面时,我可以使用 “购物车界面 “来返回导航。navigation.navigate('Cart');但在 “购物车屏幕 “和 goBack() 我的屏幕进入 “主屏幕”.如何进行管理?goBack() 从堆栈屏幕到标签屏幕?

解决方案:

在react-navigation(5之前),我实现了你说的通过上层导航作为道具向下使用自定义导航组件这样。



// this component's navigation is replaced by upper navigation, you can send another prop if you need both navigations.
const MyComponent0 = createStackNavigator(
  {
    Child1: {
      screen: Child1,
      navigationOptions: ({navigation}) => {
        return {
          headerRight: (
            // you can use BackButton of library with import it, I wrote my own, that time i didn't know there is a ready importable back button.
            <TouchableOpacity
              style={{paddingLeft: 10}}
              onPress={() => navigation.toggleDrawer()}>
              <Icon ios="ios-menu" android="md-menu" style={{color: '#fff'}} />
            </TouchableOpacity>
          ),
          headerTitle: <Text style={styles.whiteText}>Child1 title</Text>,
          headerLeft: (
            <HeaderBackButton
              style={{color: '#FFF'}}
              onPress={() => navigation.goBack(null)}
            />
          ),
        };
      },
    },
    Child2,
    ...
  },
  {
    defaultNavigationOptions: {
      headerTitleStyle: {
        color: '#fff',
        fontSize: 13,
        ...Platform.select({
          android: {
            fontFamily: ...,
          },
          ios: {
            fontFamily: ...,
          },
        }),
      },
      headerStyle: {
        backgroundColor: 'rgba(0,0,0,1)',
      },
      headerTintColor: 'white',
    },
  },
);


class MyComponent1 extends Component {
  constructor() {
    super();
  }
  static router = MyComponent0.router;

  render() {
    return <MyComponent0 navigation={this.props.navigation} />; // you can send like navigation1 if you need downward navigation too.
  }
}

这段代码是旧的方法,但在5之前的react-navigation中也能使用,希望对你有帮助。

给TA打赏
共{{data.count}}人
人已打赏
解决方案

具有高级属性的MySQL连接,如program_name。

2022-4-22 4:00:24

解决方案

如何在其他元素之前插入元素

2022-4-22 5:00:15

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索