react-native-navigation的迁移库

top-level-api.md 2.9KB

Top Level API

So as to make the navigation API as consistent and homogenous as possible, we begin with a single, unifying function -- setRoot. SetRoot receives properties for any kind of layout, whether tabs or stacks, or a combination of both (as seen in this example.)

See Layout types

setRoot(layout)

Navigation.setRoot({
  root: {
    bottomTabs: {
      children: [{
        stack: {
          children: [{
            component: {
              name: 'example.FirstTabScreen',
              passProps: {
                text: 'This is tab 1'
              }
            }
          }],
          options: {
            bottomTab: {
              text: 'Tab 1',
              icon: require('../images/one.png'),
              testID: 'FIRST_TAB_BAR_BUTTON'
            }
          }
        }
      },
      {
        component: {
          name: 'navigation.playground.TextScreen',
          passProps: {
            text: 'This is tab 2'
          },
          options: {
            bottomTab: {
              text: 'Tab 2',
              icon: require('../images/two.png'),
              testID: 'SECOND_TAB_BAR_BUTTON'
            }
          }
        }
      }]
    }
  }
});

showOverlay(layout = {})

Shows a component as an overlay.

Navigation.showOverlay({
  component: {
    name: 'example.Overlay',
    options: {
      overlay: {
        interceptTouchOutside: true
      },
      layout: {
        componentBackgroundColor: 'transparent', // Use this if you want your background to be transparent.
      },
    }
  }
});

dismissOverlay(componentId)

Dismisses an overlay matching the given overlay componentId.

Navigation.dismissOverlay(this.props.componentId);