滚动视图切断平铺列表的底部答案

【问题标题】：Scrollview cutting off the bottom of tiled-list滚动视图切断平铺列表的底部
【发布时间】：2019-11-01 14:34:42
【问题描述】：

我的 React 项目中有一个滚动视图，它应该列出数据映射。这些图块还打开手风琴样式以显示更多信息。九个项目应该被映射和查看，但是滚动视图只显示 7 个并且最后一个被切断/手风琴和瓷砖本身。

尝试：使用 flex: 1 围绕它创建一个 View，使用 FlexGrow 代替 flex，添加高度：100。

<ScrollView style={styles.contentContainer}>
        <View style={styles.accordianContainer}>
          <Accordion
            sections={this.props.gyms}
            activeSections={this.state.activeSections}
            renderHeader={this._renderHeader}
            renderContent={this._renderContent}
            onChange={this._updateSections}
            underlayColor={"#ffffff"}
          />
        </View>
      </ScrollView>


const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
  },
    contentContainer: {
      flex: 1,
      borderColor: 'red',
      borderWidth: 1,
    },
      accordianContainer: {
        height: ( Layout.noStatusBarHeight)* .9,
        width: Layout.window.width,
        marginBottom: Layout.window.height / 4,
      }

【问题讨论】：

标签： javascript css reactjs react-native scrollview

【解决方案1】：

我有类似的问题，我通过在滚动视图底部添加一个具有特定高度的额外视图找到了解决方案：

<View style={{height: 54}} />

希望对你有帮助。

【讨论】：