react-native-gifted-chat이 firebase 타임 스탬프에서 시간을 올바르게 표시하지 않는 이유는 무엇입니까?
키샨 바다
내 앱에서 react-native-gifted-chat 을 사용 하여 채팅 기능을 추가했습니다. 현재는 firebase에서 제대로 메시지를 보내고받을 수 있습니다. 그러나 문제는 react-native-gifted-chat항상 오전 12시의 메시지 전송 시간을 표시 한다는 것입니다. 이는 firebase 타임 스탬프를 시간으로 변환 할 수 없기 때문입니다. 누구든지 어떻게 해결할 수 있습니까?
GiftedChat 구성 요소를 사용하는 방법은 다음과 같습니다 .
<GiftedChat
messages={this.props.messages}
renderUsernameOnMessage={true}
onSend={messages => this.onSend(messages)}
alwaysShowSend={true}
textInputStyle={styles.composer}
minComposerHeight={40}
minInputToolbarHeight={60}
user={{
_id: this.props.account ?.user ?.uid,
name: this.props.account ?.data ?.fullName,
avatar: this.props.account ?.data ?.avatar
}}
/>
다음은 firestore에 메시지를 저장하는 데 사용한 코드입니다.
export const sendMessage = (message, groupId) => {
return async () => {
await firestore().collection('groupMessages').doc(groupId).collection('messages').doc(message._id).set(message).catch((e) => {
throw {message: e.message.replace(`[${e.code}] `, '')}
});
}
}
위의 코드에서 message속성이 포함되어 채팅 메시지 재능이있다 : _id, text, createdAt와 user.
다음은 firebase에 메시지가 저장되는 방법입니다.
메시지를 표시 할 때 :
키샨 바다
마지막으로 임시 솔루션으로 완료되었습니다. 시간을 renderTime소품 으로 커스텀으로 렌더링하여 해결합니다 .
<GiftedChat
...
renderTime={(props) => (
<View style={props.containerStyle}>
<CText size={10} style={{marginHorizontal: 10, marginBottom: 5}} bold color={props.position === "left" ? 'gray' : 'white'}>
{`${props.currentMessage.createdAt.toDate().toLocaleString('en-US', { hour: 'numeric', minute: 'numeric', hour12: true })}`}
</CText>
</View>
)}
...
...
/>
createdAt날짜 로 변환 한 다음 hh : mm AM / PM 형식으로 가져옵니다 .
참고 : 이것은 해결 방법 일 뿐이며 메시지를 저장하고 로컬에 메시지를 표시하는 경우 작동하지 않을 수 있습니다. GiftedChat에서 생성 한 메시지 필드 createdAt는 toDate()기능 이없는 순수한 자바 스크립트 날짜 개체 이므로 이러한 유형의 오류가 발생할 수 있습니다.
포착되지 않은 TypeError : (중간 값) .toDate는 : 1 : 12의 함수가 아닙니다.
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
에서 수정
몇 마디 만하겠습니다