Tôi đang cố gắng tìm ra cách hiển thị dấu thời gian của Firestore trong ứng dụng phản ứng.
Tôi có một tài liệu Firestore với một trường có tên createdAt.
Tôi đang cố gắng đưa nó vào danh sách đầu ra (trích xuất các bit có liên quan ở đây để bạn không phải đọc qua toàn bộ danh sách các trường).
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()}Thuộc tính duy nhất không hiển thị là ngày.
Mỗi lần thử trên tạo ra một lỗi cho biết:
TypeError: Không thể đọc thuộc tính 'toDate' không xác định
Tôi đã thấy bài này , và bài này và bài này , và bài này và những người khác như họ, trong đó đề xuất NHCTVN rằng () nên làm việc. Nhưng - tiện ích mở rộng này gây ra lỗi cho tôi - kể cả khi tôi thử tiện ích mở rộng toString.
Tôi biết nó biết có một cái gì đó trong Firestore bởi vì khi tôi thử user.createdAt, tôi gặp lỗi khi nói rằng nó tìm thấy một đối tượng có vài giây trong đó.
Lấy ví dụ từ Waelmas bên dưới, tôi đã cố gắng ghi nhật ký đầu ra của trường dưới dạng:
this.db.collection('users').doc('HnH5TeCU1lUjeTqAYJ34ycjt78w22').get().then(function(doc) {
console.log(doc.data().createdAt.toDate());}
Tôi cũng đã thử thêm phần này vào câu lệnh bản đồ của mình nhưng gặp lỗi cho biết user.get không phải là một hàm.
{user.get().then(function(doc) {
console.log(doc.data().createdAt.toDate());}
)}Nó tạo ra thông báo lỗi tương tự như trên.
TIẾP THEO TIẾP THEO
Một điều kỳ lạ xuất hiện khi cố gắng tìm cách ghi lại một ngày trong Firestore cho phép tôi đọc lại, đó là khi tôi thay đổi trình xử lý đệ trình của mình dưới một hình thức để sử dụng công thức này:
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();
};Điều đó làm việc để ghi lại một ngày trong cơ sở dữ liệu.
Hình thức của mục nhập Firestore trông như thế này:
Tôi đang cố gắng hiển thị một ngày trong thành phần này:
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);Khi tôi cố đọc lại - sử dụng:
{item.email}
Thông báo lỗi ghi:
Lỗi: Các đối tượng không hợp lệ dưới dạng con React (được tìm thấy: Dấu thời gian (giây = 1576363035, nano giây = 52000000)). Nếu bạn có ý định kết xuất một bộ sưu tập trẻ em, thay vào đó hãy sử dụng một mảng. trong Mục (tại User Index.jsx: 74)
Khi tôi thử sử dụng từng thử sau:
{item.createdAt}
{item.createdAt.toDate()}
{item.createdAt.toDate().toISOString()}Tôi nhận được một lỗi cho biết:
TypeError: Không thể đọc thuộc tính 'toDate' không xác định
Dựa trên khả năng đọc lại các mục được ghi trong cùng một tài liệu trong các trường khác, tôi hy vọng bất kỳ mục nào trong số này sẽ hoạt động để tạo đầu ra - cả nếu nó không được định dạng theo cách tôi muốn. Điều đó không xảy ra.
TIẾP THEO TIẾP THEO
Lấy ví dụ của Waelmas, tôi đã cố gắng làm theo hướng dẫn, nhưng ở nơi chúng tôi không nhận được phản hồi tương tự là bước đầu tiên. Trong đó Walidia nhận được đầu ra dựa trên phần mở rộng .toDate (), tôi gặp lỗi khi nói toDate () không phải là một hàm.
Phù hợp với tài liệu Firebase, tôi đã thử:
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());}})
Điều này tạo ra một chuỗi lỗi với cú pháp và tôi không thể tìm ra cách khắc phục chúng.
TIẾP THEO TIẾP THEO
Sau đó tôi đã thử tạo một biểu mẫu mới để xem liệu tôi có thể khám phá điều này mà không có khía cạnh xác thực của biểu mẫu người dùng.
Tôi có một hình thức nhận đầu vào là:
this.props.firebase.db.collection("insights").add({
title: title,
text: text,
// createdAt1: new Date(),
createdAt: this.props.firebase.fieldValue.serverTimestamp()
})Trong trường hợp ở dạng trước, nỗ lực Date () mới hoạt động để ghi lại một ngày trong cơ sở dữ liệu, trong ví dụ này cả hai trường cho createdAt và createdAt1 đều tạo cùng một mục cơ sở dữ liệu:
<div>{item.createdAt.toDate()}</div>
<div>{item.createdAt.toDate()}</div>Khi tôi cố gắng xuất giá trị của ngày, cái đầu tiên sẽ phát sinh lỗi:
Các đối tượng không có giá trị như một đứa trẻ React (được tìm thấy: CN ngày 15 tháng 12 năm 2019 21:33:32 GMT + 1100 (Giờ ban ngày miền đông Úc)). Nếu bạn có ý định kết xuất một bộ sưu tập trẻ em, thay vào đó hãy sử dụng một mảng
Thứ hai tạo ra lỗi nói:
TypeError: Không thể đọc thuộc tính 'toDate' không xác định
Tôi đang bế tắc về ý tưởng về những gì cần thử tiếp theo.
Tôi thấy bài đăng này cho thấy rằng những điều sau đây có thể làm một cái gì đó hữu ích:
{item.createdAt1.Date.valueOf()}Nó không. Nó ám chỉ một lỗi cho biết:
LoạiError: Không thể đọc thuộc tính 'Ngày' không xác định
Bài đăng này dường như có cùng rắc rối với tôi, nhưng không đi sâu vào cách họ quản lý để hiển thị giá trị ngày họ lưu trữ.
Bài đăng này dường như bị kẹt ở thông báo lỗi mảng, nhưng dường như đã tìm ra cách hiển thị một ngày bằng cách sử dụng createdAt.toDate ()
