Doesn't work with Navigator

[vigyanhoon]

It seems not to work with navigator as tab item.

  getTabView() {
    switch (this.state.page) {
      case 'Home':
        return <HomeNavigator/>
        break;
      case 'Drafts':
        return <Drafts/>
        break;
      case 'Tasks':
        return <Tasks/>
        break;
    }
  }

  render() {
    return (
      <View style={styles.container}>
        {this.getTabView()}
        <Tabs style={{backgroundColor:'white'}} selected={this.state.page} onSelect={this.tabSelected.bind(this)}>
          <View name='Home' style={styles.tabItem} selectedIconStyle={styles.selectedIconStyle}>
            <Icon name='ios-home' size={24} color='rgba(0, 0, 0, 0.54)' />
            <Text>Home</Text>
          </View>
          <View name="Drafts" style={styles.tabItem} selectedIconStyle={styles.selectedIconStyle}>
            <Icon name='ios-paper-outline' size={24} color='rgba(0, 0, 0, 0.54)' />
            <Text>Drafts</Text>
          </View>
          <View name="Tasks" style={styles.tabItem} selectedIconStyle={styles.selectedIconStyle}>
            <Icon name='ios-checkmark-circle-outline' size={24} color='rgba(0, 0, 0, 0.54)' />
            <Text>Tasks</Text>
          </View>
        </Tabs>
      </View>
    );
  }

In this if I change my view as any other view instead of HomeNavigator, it works perfectly. But not with a navigator component which is original navigator. However the same HomeNavigator works well if not inside tabs.

Can anyone help please?