react-native navigator不调用renderScene方法

时间:2017-08-21 08:01:31

标签: javascript react-native navigation react-native-android

我试图使用react-native导航器。

这是我的App.js:

import React from 'react';
import { 
          AppRegistry,
          StyleSheet, 
          Text, 
          View,
          Navigator,
       } from 'react-native';
import Login from './components/Login/login';

export default class App extends React.Component {
  constructor() {
    console.log("in default class constructor")
    super()
    this.renderScene = this.renderScene.bind(this);
  }

  renderScene(route, navigator){
    console.log("route: ",route)
    if(route.name == 'Login'){
      return <Login navigator={navigator} />
    }
    else if(route.name == 'Home'){
      return <Home navigator={navigator} />
    }
  }

  render() {
    console.log("in render")
      return (   
        <Navigator 
           initialRoute={{ name: 'Login' }}
           renderScene = {this.renderScene}
       />
    );
  }
}

这是我的login.js

 import React from 'react';
    import { 
              AppRegistry,
              StyleSheet, 
              Text, 
              View, 
              Navigator,
            } from 'react-native';

    class Login extends React.Component {

  render() {
    return (
      <View style={styles.container}>  <Text>Domain: </Text> </View>
    );
  }
}
const styles = StyleSheet.create({
  container: {
    flex: 1,
    padding: 20,
    height: 1000,
    width: 350
  }
});    
module.exports = Login;

renderScene方法中的控制台语句未被命中。如果我只是渲染Login它正在工作,但如果我使用上面提到的Navigator,它不会在屏幕上呈现任何内容,但编译时没有错误。

控制台输出:

 in default class constructor

 in render

0 个答案:

没有答案