반응 앱에 Firestore 타임 스탬프를 표시하는 방법을 알아 내려고합니다.
createdAt라는 필드가있는 firestore 문서가 있습니다.
출력 목록에 포함하려고합니다 (전체 필드 목록을 읽을 필요가 없도록 여기에서 관련 비트를 추출).
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 확장을 시도 할 때를 포함하여 오류를 발생시킵니다.
user.createdAt를 시도 할 때 초 안에 객체를 발견했다는 오류가 발생하기 때문에 firestore에 무언가가 있다는 것을 알고 있습니다.
아래의 Waelmas에서 예를 들어, 필드의 출력을 다음과 같이 기록하려고했습니다.
this.db.collection('users').doc('HnH5TeCU1lUjeTqAYJ34ycjt78w22').get().then(function(doc) {
console.log(doc.data().createdAt.toDate());}
또한 이것을 내 맵 문에 추가하려고 시도했지만 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 (seconds = 1576363035, nanoseconds = 52000000)). 자식 컬렉션을 렌더링하려면 대신 배열을 사용하십시오. 항목 (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()
})이전 양식에서 new Date () 시도는 데이터베이스에 날짜를 기록하려고 시도한 경우 (이 예에서는 createdAt 및 createdAt1에 대한 두 필드 모두 동일한 데이터베이스 항목을 생성 함)
<div>{item.createdAt.toDate()}</div>
<div>{item.createdAt.toDate()}</div>날짜 값을 출력하려고하면 첫 번째 값이 다음과 같은 오류를 생성합니다.
개체는 React 자식으로 유효하지 않습니다 (발견 : Sun Dec 15 2019 21:33:32 GMT + 1100 (호주 동부 일광 절약 시간)). 자식 컬렉션을 렌더링하려면 대신 배열을 사용하십시오.
두 번째는 다음과 같은 오류를 생성합니다.
TypeError : 정의되지 않은 'toDate'속성을 읽을 수 없습니다
나는 다음에 무엇을 시도해야하는지에 대한 아이디어를 고집하고있다
다음 게시물 이 유용한 것을 제안하는 이 게시물 을 보았습니다 .
{item.createdAt1.Date.valueOf()}그렇지 않습니다. 다음과 같은 오류가 발생합니다.
TypeError : 정의되지 않은 '날짜'속성을 읽을 수 없습니다
이 게시물 은 나와 같은 문제가있는 것 같지만 저장된 날짜 값을 표시하는 방법에 대해서는 다루지 않습니다.
이 게시물 은 배열 오류 메시지에 붙어있는 것처럼 보이지만 createdAt.toDate ()를 사용하여 날짜를 표시하는 방법을 알아 낸 것 같습니다.
