我试图弄清楚如何在React应用程序中显示Firestore时间戳。
我有一个Firestore文档，其中的字段名为createdAt。
我正在尝试将其包含在输出列表中（在此处提取相关位，以便您不必通读整个字段列表）。
componentDidMount() {
this.setState({ loading: true });
this.unsubscribe = this.props.firebase
.users()
.onSnapshot(snapshot => {
let users = [];
snapshot.forEach(doc =>
users.push({ ...doc.data(), uid: doc.id }),
);
this.setState({
users,
loading: false,
});
});
}
componentWillUnmount() {
this.unsubscribe();
}
render() {
const { users, loading } = this.state;
return (
<div>
{loading && <div>Loading ...</div>}
{users.map(user => (
<Paragraph key={user.uid}>
<key={user.uid}>
{user.email}
{user.name}
{user.createdAt.toDate()}
{user.createdAt.toDate}
{user.createdAt.toDate()).toDateString()}唯一无法呈现的属性是日期。
上面的每一次尝试都会产生一个错误，指出：
TypeError：无法读取未定义的属性“ toDate”
我看过这篇文章，这篇文章和这篇文章，以及其他类似的文章，它们暗示toDate（）应该可以工作。但是-此扩展名对我抛出错误-包括当我尝试toString扩展名时。
我知道它知道Firestore中有什么东西，因为当我尝试user.createdAt时，我收到一条错误消息，说它找到了一个包含秒数的对象。
以下面的Waelmas为例，我尝试将字段的输出记录为：
this.db.collection('users').doc('HnH5TeCU1lUjeTqAYJ34ycjt78w22').get().then(function(doc) {
console.log(doc.data().createdAt.toDate());}
我也尝试将其添加到我的map语句中，但是收到一条错误消息，指出user.get不是函数。
{user.get().then(function(doc) {
console.log(doc.data().createdAt.toDate());}
)}它生成与上面相同的错误消息。
下次尝试
试图找到一种在Firestore中记录日期的方法时出现的一件奇怪的事情是，当我以一种形式更改提交处理程序以使用此公式时，便可以回读它：
handleCreate = (event) => {
const { form } = this.formRef.props;
form.validateFields((err, values) => {
if (err) {
return;
};
const payload = {
name: values.name,
// createdAt: this.fieldValue.Timestamp()
// createdAt: this.props.firebase.fieldValue.serverTimestamp()
}
console.log("formvalues", payload);
// console.log(_firebase.fieldValue.serverTimestamp());
this.props.firebase
.doCreateUserWithEmailAndPassword(values.email, values.password)
.then(authUser => {
return this.props.firebase.user(authUser.user.uid).set(
{
name: values.name,
email: values.email,
createdAt: new Date()
// .toISOString()
// createdAt: this.props.firebase.fieldValue.serverTimestamp()
},
{ merge: true },
);
// console.log(this.props.firebase.fieldValue.serverTimestamp())
})
.then(() => {
return this.props.firebase.doSendEmailVerification();
})
// .then(() => {message.success("Success") })
.then(() => {
this.setState({ ...initialValues });
this.props.history.push(ROUTES.DASHBOARD);
})
});
event.preventDefault();
};这可以在数据库中记录日期。
firestore条目的形式如下所示：
我正在尝试在此组件中显示日期：
class UserList extends Component {
constructor(props) {
super(props);
this.state = {
loading: false,
users: [],
};
}
componentDidMount() {
this.setState({ loading: true });
this.unsubscribe = this.props.firebase
.users()
.onSnapshot(snapshot => {
let users = [];
snapshot.forEach(doc =>
users.push({ ...doc.data(), uid: doc.id }),
);
this.setState({
users,
loading: false,
});
});
}
componentWillUnmount() {
this.unsubscribe();
}
render() {
const { users, loading } = this.state;
return (
<div>
{loading && <div>Loading ...</div>}
<List
itemLayout="horizontal"
dataSource={users}
renderItem={item => (
<List.Item key={item.uid}>
<List.Item.Meta
title={item.name}
description={item.organisation}
/>
{item.email}
{item.createdAt}
{item.createdAt.toDate()}
{item.createdAt.toDate().toISOString()}
</List.Item>
// )
)}
/>
</div>
);
}
}
export default withFirebase(UserList);当我尝试将其读回时，使用：
{item.email}
错误消息显示为：
错误：对象作为React子对象无效（找到：Timestamp（秒= 1576363035，纳秒= 52000000））。如果要渲染子级集合，请改用数组。在Item中（在UserIndex.jsx：74处）
当我尝试使用以下每种尝试时：
{item.createdAt}
{item.createdAt.toDate()}
{item.createdAt.toDate().toISOString()}我收到一条错误消息：
TypeError：无法读取未定义的属性“ toDate”
基于能够读回其他字段中同一文档中记录的条目的能力，我希望这些格式中的任何一个都可以产生输出-即使它不是按照我想要的方式格式化的。那不会发生。
下次尝试
以Waelmas的示例为例，我尝试按照说明进行操作，但是第一步没有得到相同的答复。在Walemas基于.toDate（）扩展名获取输出的地方，我收到一条错误消息，指出toDate（）不是函数。
与Firebase文档一致，我尝试过：
const docRef = this.props.firebase.db.collection("users").doc("HnH5TeCU1lUjeTqAYJ34ycjt78w22");
docRef.get().then(function(docRef) {
if (doc.exists) {
console.log("Document createdAt:", docRef.createdAt.toDate());}}
这会产生语法错误，我找不到解决方法。
下次尝试
然后，我尝试制作一个新表单，以查看是否可以在没有用户表单的身份验证方面进行探索。
我有一个输入为的表格：
this.props.firebase.db.collection("insights").add({
title: title,
text: text,
// createdAt1: new Date(),
createdAt: this.props.firebase.fieldValue.serverTimestamp()
})在前一种形式中，新的Date（）尝试在数据库中记录日期，在此示例中，createdAt和createdAt1的两个字段都生成相同的数据库条目：
<div>{item.createdAt.toDate()}</div>
<div>{item.createdAt.toDate()}</div>当我尝试输出日期的值时，第一个生成一个错误，提示：
对象不是有效的React子对象（发现：Sun Dec 15 2019 21:33:32 GMT + 1100（Australian Eastern Daylight Time））。如果要渲染子级集合，请改用数组
第二个生成错误说：
TypeError：无法读取未定义的属性“ toDate”
我对接下来要尝试的方法有想法。
我看到这篇文章表明以下内容可能会做一些有用的事情：
{item.createdAt1.Date.valueOf()}没有。它将显示一个错误，指出：
TypeError：无法读取未定义的属性“日期”
这篇文章似乎和我有同样的麻烦，但是没有涉及他们如何设法显示存储的日期值。
这篇文章似乎陷入了数组错误消息，但是似乎已经弄清楚了如何使用createdAt.toDate（）显示日期。
