#react-native #redux #google-cloud-firestore #react-native-firebase
# #react-native #сокращение #google-облако-firestore #react-native-firebase
Вопрос:
Я получаю сообщения от firebase / fire store в режиме реального времени. Но я хочу запрашивать данные динамически, передавая динамическое число (дату) в предложения where в Firestore и получая данные, если номер (дата) данных больше заданного динамического числа. Я получаю динамические данные из хранилища redux и передаю их в where через props. но проблема в том, что номер не обновляется. Я определил материал Firestore внутри конструктора. Я приложил свой код ниже. Моя цель — получить данные из Firestore, если дата данных больше заданной даты.
Я перепробовал много способов и обнаружил, что, когда я отправляю сообщения из серверной части, динамическая дата, проходящая через redux, не обновляет bcoz, потому что я использую это значение реквизита внутри моего конструктора.
...
import firebase from 'react-native-firebase'
import {addLastSeen} from '../Redux/Actions'
import {addMessage} from '../Redux/Actions'
import {connect} from 'react-redux'
firebase.initializeApp({
apiKey: 'AIzaSyDA8acz_UcdHK1QaIPd6sG1Cp5bma_gTvg',
projectId: 'notifaapp'
})
const firestore = firebase.firestore()
class Navigate extends React.Component{
constructor(props) {
super(props);
this.ref = firestore.collection('messages')
.orderBy('date', 'desc')
.where("date",'>' ,this.props.lastSeen)
// date is something like this 1555520642840
// this.props.lastSeen is getting from redux store via props
this.unsubscribe = null;
}
componentDidMount() {
this.unsubscribe = this.ref.onSnapshot(this.onCollectionUpdate)
}
componentWillUnmount() {
this.unsubscribe();
}
onCollectionUpdate = (querySnapshot) => {
const todos = [];
querySnapshot.forEach((doc) => {
const { title, complete, message, date } = doc.data();
this.props.addLastSeen(date) // dispatching an action and update redux store
todos.push({
key: doc.id,
title,
message,
date : new Date(date)
});
});
alert(JSON.stringify(todos))
todos.map(value => {
message = {
"key": value.key,
"title": value.title,
"body": value.message,
"date": value.date,
"read":"false",
"archived":"false"
}
this.props.add(message)
})
}
render(){
return(
...
)
}
}
function mapStateToProps(state){
return {
lastSeen : state.lastSeen.date,// getting date from redux store
}
}
export default connect(mapStateToProps, {add:addMessage, addLastSeen:addLastSeen})(Navigate)
Ответ №1:
Вы не можете изменить запрос onSnapshot без создания нового запроса и повторной подписки.
Вы можете воспользоваться вызовом жизненного цикла componentDidUpdate и проверить, не изменилось ли свойство lastseen.
componentDidUpdate(prevProps) {
// Typical usage (don't forget to compare props):
if (this.props.lastSeen !== prevProps.lastSeen) {
// un-subscribe and re-subsricbe with modified query
}
}
Хотя это может решить вашу проблему, я полагаю, что это вызовет множество действий с подпиской и повторных рендерингов
Комментарии:
1. Большое вам спасибо. Хотя я не получил окончательный результат, я получил что-то в вашем ответе, что «Вы не можете изменить запрос onSnapshot без создания нового запроса и повторной подписки».. Вы правы, этот способ вызывает много повторных рендерингов. Таким образом, это вызывает другую проблему. Итак, я нашел другой способ отказаться от подписки и повторно подписаться. Я поместил все в рендеринг, и все сработало нормально.