Проблема при загрузке компонента с помощью TabBarIOS через Navigator

Я пытался загрузить компонент через функцию RenderScene под Навигатором. Если маршрут не содержит какого-либо соответствующего объекта, основанного на route.object, я бы запустил навигатор, чтобы вернуть представление с tabBarIOS, код во втором фрагменте - это то, как выглядит TabView.

render: function() {
    var initialRoute = {login: true};
    return (
        <Navigator
          ref="navigator"
          style={styles.container}
          configureScene={(route) => {
            if(Platform.OS === 'android') {
              return Navigator.SceneConfigs.FloatFromBottomAndroid;
            }
            //
            else {
              return Navigator.SceneConfigs.FloatFromBottom;
            }
          }}
          initialRoute={initialRoute}
          renderScene={this.renderScene}
          navigationBar={
            <Navigator.NavigationBar
              routeMapper={NavigationBarRouteMapper}
              style={styles.navBar}
            />
          }
          />

    );
  },

  renderScene: function(route, navigator) {
      if(route.login) {
        return (
          <LoginScreen
            navigator={navigator}
            onLogin={route.callback}
            />
        );
      }

        return (
            <HomeTab navigator={navigator}/>
        );
      
  }

Компонент с вкладками и предположительно домашняя страница после входа в систему это

import React, { Component } from 'react';
import {
  AppRegistry,
  TabBarIOS,
  StyleSheet
} from 'react-native';

var Welcome = require('./welcome.ios');
var More = require('./more.ios');

export default class TabBarIOSSpike extends Component {
  constructor(props) {
      super(props);
      this.state = {
        selectedTab: 'welcome'
      };
    }


  render() {
    return (
      <TabBarIOS selectedTab={this.state.selectedTab}>
        <TabBarIOS.Item
          selected={this.state.selectedTab === 'welcome'}
          icon={{uri:'featured'}}
          onPress={() => {
              this.setState({
                  selectedTab: 'welcome',
              });
          }}>
            <Welcome/>
        </TabBarIOS.Item>
        <TabBarIOS.Item
          selected={this.state.selectedTab === 'more'}
          icon={{uri:'contacts'}}
          onPress={() => {
                this.setState({
                    selectedTab: 'more',
                });
          }}>
          <More/>
        </TabBarIOS.Item>
      </TabBarIOS>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
  },
  instructions: {
    textAlign: 'center',
    color: '#333333',
    marginBottom: 5,
  },
});

Я получаю странную ошибку ниже. Кстати, я протестировал загрузку hometab в качестве домашней страницы, и она отлично работает, только в этом случае, если она подключена к навигатору.

Unhandled JS Exception: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object. Check the render method of `Navigator`.

0 ответов

Другие вопросы по тегам