防止外部组件在顶部添加空格

Question

在 React Native 中，我有这个组件：

class List extends Component {
  render() {
    return (
      <Provider store={store}>
        <View style={ styles.container } >
          <ListContainer />
        </View>
      </Provider>
    );
  }
}

View组件具有以下样式：

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignSelf: 'center',
    alignItems: 'center',
    flexDirection: 'row',
    backgroundColor: '#000000',
  }
});

这曾经占据了整个屏幕。但是，我添加了一个StackNavigator组件：

const MyApp = StackNavigator({
  List: { screen: List },
  OtherComponent: { screen: OtherComponent }
});

现在我的组件不再占据整个屏幕。顶部有一个奇怪的空白区域。我相信现在我的View组件嵌套在其他组件中，不知何故，这使得它不会占据全屏。

那么如何让我的View再次占据整个屏幕呢？

Answer 1

这是

StackNavigator的问题。我不得不从这里更改代码：

List: { screen: List },

对此：

List: { screen: List, navigationOptions: { header: null } },