android - 动态调整 FlatList 大小以包装内容

Question

作为序言，我已经阅读了这个，但它对我不起作用。使用它会使我的列表根本不显示，但这是我想要实现的目标：

我正在开发一个评论系统，我希望最新的评论显示在底部，当你打开屏幕时，你会自动位于列表的底部，这样你就可以看到最新的评论。很简单，只需将您交给列表的列表反转并在 onLayout 和 onContentSizeChange 中向下滚动到底部。

问题在于注释的长度当然不同，因此 FlatList 的元素是动态调整大小的，这使得向下滚动有点卡顿。

另一种解决方案是使用“倒置”道具，但在这里，当评论少于填满屏幕所需的评论时，FlatList 看起来像这样：

我将 FlatList 的背景涂成黑色，看看发生了什么。

有什么办法可以让 FlatList 包装内容并随之扩展，直到它达到屏幕高度？

这是我的列表代码：

  <View flex={1} backgroundColor={'white'}>
        <TabHeader store={store}/>
        <FlatList
          inverted
          ref={ref => store.flatList = ref}
          data={elements}
          renderItem={({item, index}) => (
            <CommentRow
              item={item}
              index={index}
            />
          )}
          ListFooterComponent={() => <TabFooter store={store} />}
          onEndReachedThreshold ={0.1}
          onEndReached={({ distanceFromEnd }) => {
            loadNext();
          }}
          style={{backgroundColor: 'black'}}
        />
        <Row h={0.3}/>
        <TextInput
          ref={ref => store.textInput = ref}
          multiline
          blurOnSubmit
          underlineColorAndroid={'transparent'}
          onFocus={store.hideTabs}
          autoFocus={store.focusOnStart}
          onEndEditing={store.showTabs}
          onSubmitEditing={store.submitComment}
          value={store.userComment}
          onChangeText={store.changeText}
          placeholder={placeholder}
          autoCorrect={false}
          style={{marginLeft: 20}}
        />
        <Row h={0.3} />
      </View>

谢谢！

标签： androidreact-nativejsx