Question

我有ListView使用onLayout道具来检索初始布局属性。此ListView也正在过滤，其中列表项在添加时被删除。每次更改ListView的大小时，如何获得新的高度？

onLayoutAction = (event) => {
    var layout = event.nativeEvent.layout
    const {height} = layout
    this.setState({
        currentListHeight : height - 61
    })
}

  renderListView = () => {
    if (this.noRowData()) {
      return (
          <AlertMessage title='No Offerings Available' show={this.noRowData()} />
      )
    } else {
      // TODO: fix refreash control below
      return (
          <ListView
            ref='listView'
            onLayout={this.onLayoutAction}
            scrollEventThrottle={16}
            onScroll={this.onScrollAction}
            contentContainerStyle={styles.listContent}
            dataSource={this.state.dataSource}
            renderRow={this.renderRow}
            renderHeader={this.renderHeader}
            renderFooter={this.renderFooter}
            enableEmptySections
            pageSize={15}
            refreshControl={
              <RefreshControl
                refreshing={this.props.isLoading}
                onRefresh={this.handleOnRefresh}
                tintColor='#000000'
                title='Loading...'
                titleColor='#000000'
                colors={['#000000', '#000000', '#000000']}
                progressBackgroundColor='#ffffff' />
              }
            />
      )
    }
  }

Answer 1

应该在mount上调用onLayout函数，并根据文档调整每个布局：

https://facebook.github.io/react-native/docs/view.html

我做了一个快速测试，并在我的应用程序中向ListView添加了onLayout函数。每次我将一个项目添加到列表中时都会调用它。我没有测试删除项目，但我认为它是相同的。

您也可以查看onContentSizeChange。每次在ListView使用的ScrollView中更改内容时都会触发

https://facebook.github.io/react-native/docs/scrollview.html#oncontentsizechange

在ListView大小更改后获取layout.height

1 个答案: