反转FlatList

Question

我目前正在研究用于android的react本机应用程序,并且可以访问新的FlatList.它有一些非常需要的功能.但是,我的listview使用react-native-invertable-scroll-view反转.这似乎与FlatList无法正常工作.滚动未正确反转.

有谁知道如何反转FlatList？或者也许如何加载一个Flatlist,然后强制滚动到底部而不是用户注意到它？我自己试图强行向下滚动的尝试经常被推迟.

Answer 1

这个现在开箱即用FlatList!

只需使用:

<FlatList
  inverted
  data=...
  renderItem=...
/>

这会导致第一个项目出现在列表的底部,列表从底部开始,显示第一个项目.

如果您需要在底部显示最后一项,只需反转您在data道具中提供的阵列.

Answer 2

render() {
const messages = this.props.messages.reverse();

return (
  <FlatList
    renderItem={this._renderItem}
    data={ messages }
    keyExtractor={this._keyExtractor}
    style={{  transform: [{ scaleY: -1 }] }}
  />
); }

_keyExtractor = (item, index) => item.id+''+index;

_renderItem = ({item}) => (
<View style={{ transform: [{ scaleY: -1 }]}}>
  <ChatItem />
</View>)

好好享受)