在 Flatlist 中显示来自 Firestore 时间戳的日期答案

【问题标题】：Display Date from Firestore timestamp in Flatlist在 Flatlist 中显示来自 Firestore 时间戳的日期
【发布时间】：2021-06-05 23:42:23
【问题描述】：

我有一个 Flatlist 来显示来自 Firestore 的数据，Flatlist 渲染项如下，

const Card = ({ item }) => (

    <View style={styles.card}>           
        <View style={styles.itemDetails}>
          <Text style={styles.itemTitle}>{item.title}</Text>
          <Text style={styles.itemDescription}>{item.description}</Text>
        </View>
        <View style={styles.timerContainer}>
          <Text style={styles.timer}>{item.expTime}</Text>
          <Text style={styles.palceHolder}>Remaning Time</Text>
        </View>
    </View>
);

当我如上显示时间时，出现以下错误

谁能帮我解决这个问题。谢谢

【问题讨论】：

错误是作为一个对象发生的，在将其转换为字符串时检查这个问题stackoverflow.com/questions/52247445/…
我看到了那个问题，问题是将时间戳转换为平面列表中的日期

标签： firebase react-native google-cloud-firestore react-native-flatlist

【解决方案1】：

当您尝试在 Text 内渲染对象时会出现问题，您必须在显示之前转换日期，请尝试以下操作。

const Card = ({ item }) => {

const time=  new Date(
      item.expTime.seconds * 1000 + item.expTime.nanoseconds / 1000000,
    );
return (
    <View style={styles.card}>           
        <View style={styles.itemDetails}>
          <Text style={styles.itemTitle}>{item.title}</Text>
          <Text style={styles.itemDescription}>{item.description}</Text>
        </View>
        <View style={styles.timerContainer}>
          <Text style={styles.timer}>{time.toDateString()}</Text>
          <Text style={styles.palceHolder}>Remaning Time</Text>
        </View>
    </View>
)};

【讨论】：