首页 > 解决方案 > 发布消息底部平面列表

问题描述

例子

我需要从下到上定位消息,但 FlatList 不支持定位

<FlatList
 ListEmptyComponent={<ActivityIndicator style={{marginTop: 20}} size="large" color="gray" />}
 data={DATA}
 renderItem={({ item, index }) => (
   <Message
     key={index}
     text={item.title}
     uri={item.uri}
     name={item.name}
     time={item.time}
     sticker={item.sticker}
     anim={item.anim}
     audio={item.audio}
     link={item.link}
   />
 )}
 keyExtractor={item => item.id}
/>

标签: reactjsreact-native

解决方案


可以在 FlatList 上使用 CSS 来完成

style={{flex:1, position: 'absolute', bottom: 0, width:"100%" }}

已编辑

 style={{width:"100%", height: "100%", justifyContent:"flex-end"}}

https://snack.expo.io/@jsfit/a130ed


推荐阅读