Standalone TabBar by passing navigation props doesnt work

[ranadeep47]

Version

Tell us which versions you are using:

"react-native-router-flux": "^4.0.0-beta.28",
"react-native": "https://github.com/expo/react-native/archive/sdk-26.0.0.tar.gz",

In the code below i cant get the <TabBar /> to work by passing this.props.navigation as a navigation prop. I need a standalone TabBar that isnt defined in the Router.

I get the following error:

class HomeScreen extends React.Component {
  render() {
    return (
      <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
        <Text>Home!</Text>
      </View>
    );
  }
}

class SettingsScreen extends React.Component {
  render() {
    return (
      <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
        <Text>Settings!</Text>
      </View>
    );
  }
}

let TabBar = createMaterialTopTabNavigator({
  Home: HomeScreen,
  Settings: SettingsScreen,
});

export default class PatientBookings extends React.Component {
  constructor(props) {
    super(props);
    this.state = {}
  }

  render() {    
    return (
      <TabBar navigation={this.props.navigation} />
    )
  }
}

[daviscabral]

@ranadeep47 do you mind upgrading your rnrf to the last version to see if might pass the right navigation prop forward?

[ranadeep47]

I have upgraded it to react-native-router-flux": "^4.0.0-beta.30 and still the issue persists. For now i have managed to get this working by using https://github.com/react-native-community/react-native-tab-view

[daviscabral]

@ranadeep47 It seems you are using react-navigation 2.0 that is not supported yet by this project.