头像下方 React Native Elements 的 ListItem 的样式副标题答案

【问题标题】：Style subtitle of ListItem of React Native Elements below avatar头像下方 React Native Elements 的 ListItem 的样式副标题
【发布时间】：2017-11-04 15:06:02
【问题描述】：

我想设置我的 ListItem 的样式，使副标题成为头像和标题下方的块。像这样：

目前副标题在头像的右侧，这似乎是 ListItems 的默认样式。

我的代码：

  renderItems = (item) => {
    return <ListItem
      containerStyle={styles.listItem}
      title={item.data.title}
      avatar={{uri:item.data.thumbnail}}
      subtitle={
        <View style={styles.subtitle}>
          <Text>{item.data.author}</Text>
          <Text>{item.data.score}</Text>
          <Text>{item.data.num_comments}</Text>
        </View>
      }
    />
  }
  
const styles = StyleSheet.create({
  listItem: {
    display: 'flex',
  },
  subtitle: {
    display: 'flex',
    flexDirection: 'row',
    justifyContent: 'space-around',
  },
});

【问题讨论】：

标签： react-native flexbox

【解决方案1】：

据我所知没有。

但是，作为一种解决方法，您可以使用containerStyle 使每个列表项足够高以包含您的初始设计，并在subtitleStyle 上使用position: 'absolute', bottom: 0, left: 0, right: 0 来锁定您的字幕。

【讨论】：