React native 添加时间间隔以响应本机元素ListItem

我使用

React原生元素

ListItem

来呈现

平面列表

中的项目。我想在标题的同一行中设置timeago文本（例如：20分钟前）。但当我将suttitle的行数设置为5时，timeago文本将进入subtitle行。我怎样才能解决这个问题

<FlatList
  data={this.props.data}
  renderItem={({item}) => (
    <ListItem
      roundAvatar={true}
      avatar={{uri: item.picture.thumbnail}}
      title={`${item.name.first} ${item.name.last}`}
      titleStyle={styles.title}
      rightTitle="20 Minutes Ago"
      rightTitleStyle={styles.rightTitle}
      rightTitleContainerStyle={styles.rightTitleContainer}
      //  subtitle="This is a sample comment which was commented by the developer."
      subtitleStyle={styles.subtitle}
      subtitleContainerStyle={styles.subtitleContainer}
      subtitleNumberOfLines={5}
      hideChevron={true}
      containerStyle={styles.flatListContainer}
    />
  )}
  keyExtractor={item => item.email}
  ItemSeparatorComponent={this.seperator}
  onRefresh={this.handleRefresh}
  refreshing={this.props.refreshing}
  onEndReached={this.handleLoadMore}
  onEndReachedThreshold={50}
/>

(
)}
keyExtractor={item=>item.email}
ItemSeparatorComponent={this.separator}
onRefresh={this.handleRefresh}
刷新={this.props.refreshing}
onEndReached={this.handleLoadMore}
onEndReachedThreshold={50}
/>

垂直居中是

提供rightTitle以使标题显示在按钮的右侧

为此，您可以添加

---

你能为

列表项发布
样式
吗？你想不想设置字幕？我想有5行字幕。副标题是评论。const styles=StyleSheet.create（{container:{flex:1}，listItemContainer:{flex:1，borderBottomWidth:0}，分隔符：{height:1，width:“86%”，backgroundColor:“#CED0CE”，marginLeft:“12%”，标题：{marginLeft:5，fontSize:16，fontWeight:“600”，颜色：“black”}，副标题：{marginLeft:5，fontSize:14，fontwweight:“normal”}，rightTitle:{color:“grey”，fontSize:12}）；非常感谢Pritish。我花了一整天的时间来解决这个问题。有一个小问题。我想增加头像的大小。头像应该是圆形的。但是当我增加大小时，它会变成方形。我如何解决它呢？如果你也能发布一个问题，以及头像的相关样式，那就太好了。这是新q的链接uestion Pritish。是的，我给了那个一个一个答案。正如你所解释的。谢谢Pritish。我在这里问了另一个问题。你能帮个忙吗？
{position: 'absolute', top: (YOUR_TITLE_FONT_SIZE - YOUR_RIGHT_TITLE_FONT_SIZE) / 2, right: 0}