react-native - onPress 事件触发 ListView Item 而不是 TabBarIOS Item

Question

我有一个 react-native 应用程序，在屏幕底部有一个可滚动ListView的可点击项目。TabBarIOS我相信你明白了，但附上截图以防万一。

出于某种原因，当我点击TabBarIOS.Item它时，它会触发下面的可点击项目，我不知道为什么。

发布我的渲染功能。如果有人能告诉我我做错了什么或提出一些我可以尝试的建议，我将不胜感激。提前致谢。

render() {

if (!this.state.loaded) {
  return this.renderLoadingView();
}

return (
  <View style={{ flex: 1 }}>
    <StatusBar
      hidden={true}
      barStyle="light-content"
    />
    <View style={styles.chapterListHeader}>
      <Text style={styles.chapterListTitleText}>Chapters</Text>
      <Image
        style={styles.clutchLogoImage}
        resizeMode="contain"
        source={require('../Assets/Images/clutchLogoSmall.png')}
      />
    </View>
    <ListView
      dataSource={this.state.dataSource}
      renderRow={this.renderChapter.bind(this)}
      renderFooter={this.renderFooter.bind(this)}
      style={styles.chapterList}
      onEndReached={() => {console.log('end reached')}}
      renderSeparator={(sectionID, rowID) => <View key={`${sectionID}-${rowID}`} style={styles.separator} />}
    />

    <View>
      <View>

        <TabBarIOS>
          <TabBarIOS.Item
             systemIcon="history"
             selected={this.state.selectedTab === 'tabOne'}
             onPress={() => this.setTab('tabOne')}
           ></TabBarIOS.Item>

          <TabBarIOS.Item
             systemIcon="bookmarks"
             selected={this.state.selectedTab === 'tabTwo'}
             onPress={() => this.setTab('tabTwo')}
             ></TabBarIOS.Item>

          <TabBarIOS.Item
             systemIcon="more"
             selected={this.state.selectedTab === 'tabThree'}
             onPress={() => this.setTab('tabThree')}
             ></TabBarIOS.Item>
        </TabBarIOS>
      </View>
    </View>

  </View>
);
}

Answer 1

您是否尝试过ListView将父母View的身高减去您的身高TabBar？这将防止 中的最后一项ListView隐藏在TabBar组件下。