react-native-navigation/docs/docs/top-level-api-migration.md

Top Level API Migration

In order to make our API homogenous as much as possible, we provide setRoot function that will receive layout of any kind.

startTabBasedApp(params) -> setRoot({bottomTabs})

Navigation.setRoot({
  bottomTabs: {
    children: [{
      stack: {
        children: [{
          component: {
            name: 'example.FirstTabScreen',
            passProps: {
              text: 'This is tab 1'
            }
          }
        }],
        options: {
          bottomTab: {
            title: '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: {
            title: 'Tab 2',
            icon: require('../images/two.png'),
            testID: 'SECOND_TAB_BAR_BUTTON'
          }
        }
      }
    }]
  }
});

startSingleScreenApp(params) -> setRoot({stack})

Change your app root into an app based on a single screen (like the iOS Calendar or Settings app). The screen will receive its own navigation stack with a native nav bar

Navigation.setRoot({
  stack: {
    children: [{
      component: {
        name: 'example.WelcomeScreen',
        passProps: {
          text: 'stack with one child'
        }
      }
    }],
    options: {
      topBar: {
        title: {
          text: 'Welcome screen'
        }
      }
    }
  }
});

showModal(params = {}) -> showModal(layout = {})

Show a screen as a modal.

Navigation.showModal({
  stack: {
    children: [{
      component: {
        name: 'example.ModalScreen',
        passProps: {
          text: 'stack with one child'
        },
        options: {
          topBar: {
            title: {
              text: 'Modal with stack'
            }
          }
        }
      }
    }]
  }
});

dismissModal(params = {}) -> dismissModal(componentId)

Dismiss the current modal.

Navigation.dismissModal(this.props.componentId);

dismissAllModals(params = {}) -> dismissAllModals()

Dismiss all the current modals at the same time.

Navigation.dismissAllModals();