NavigatorIOS不呈现initialroute

时间:2017-04-15 23:21:53

标签: react-native

我几乎从Facebook复制并粘贴了演示代码,但是initialRoute组件没有渲染。像类似问题所建议的设置flex:1的答案对我来说并不起作用。有什么提示吗?

doesn't work



import React, { Component } from 'react';
import {
  StyleSheet,
  NavigatorIOS,
  StatusBar,
  AppRegistry,
  View,
  Text,
  TouchableHighlight,
} from 'react-native';
import NativeThing from './components/ReactNative';

export default class ListsList extends Component {
  render() {
    return (
      <NavigatorIOS
        initialRoute={{
          component: MyScene,
          title: 'My Initial Scene',
        }}
        style={{flex: 1}}
      />
    );
  }
}

class MyScene extends Component {

  _onForward = () => {
    this.props.navigator.push({
      title: 'Scene ' + nextIndex,
    });
  }

  render() {
    return (
      <View>
        <Text>Current Scene: { this.props.title }</Text>
        <TouchableHighlight onPress={this._onForward}>
          <Text>Tap me to load the next scene</Text>
        </TouchableHighlight>
      </View>
    )
  }
}

var styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#F5FCFF',
  }
});

AppRegistry.registerComponent('ListsList', () => ListsList);
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:1)

默认情况下,导航栏会重叠MyScene组件的内容。这是具有半透明效果的NavigatorIOS的默认行为 导航栏。

所以你有两个选择:

  1. 将样式paddingTop: 64添加到MyScene视图。
  2. 将属性translucent={ false }添加到NavigatorIOS