Я использую реакцию js для работы с firebase.
поправьте меня, если я ошибаюсь, пожалуйста:
предположим, что на одной странице есть 1000 пользователей, и все они прослушивают изменения коллекции. если один из них, скажем, поставил один лайк сообщению, то все 1000 пользователей сделают запрос на чтение в firebase? (не финансово выгодно).
Чего я хочу добиться: просто слушайте изменения для пользователя, который внес изменения в коллекцию, и отпишитесь от прослушивания других, они увидят изменения только в том случае, если перезагрузят страницу.
можно ли реализовать такую логику с firebase? заранее спасибо
В вашем случае вы не должны использовать прослушиватель Firestore. Вместо этого вы должны получить данные один раз с помощью useEffect
и обновлять компонент только с помощью setState()
, когда пользователю понравился пост. См. пример кода ниже:
const [value, setValue] = useState([])
const colRef = query(collection(db, "<collection>"))
// This will only get collection documents once.
// Needs to refresh/reload page to get updated data.
useEffect(() => {
const getDataOnce = async () => {
const querySnapshot = await getDocs(colRef);
renderData(querySnapshot)
}
getDataOnce()
}, [])
// Handles the click button which updates the state.
// Renders updated value to only user who triggered this async function.
async function handleClick() {
// Document reference to be updated.
const docRef = doc(db, "<collection>", "<document-id>")
// Updates the document reference.
await updateDoc(docRef, {
like: increment(1)
})
// Get the new updated data from the collection.
const querySnapshot = await getDocs(colRef)
// Sets the data to the `setValue` state.
renderData(querySnapshot)
}
// Sets the data to the setValue state.
function renderData(querySnapshot) {
setValue(querySnapshot.docs.map(doc => ({
id: doc.id,
data: doc.data()
})))
}
Приведенный выше пример кода будет получать обновленные данные только для конкретного пользователя, внесшего изменение. Другим пользователям придется перезагрузить/обновить страницу, чтобы получить обновленные данные. Я также оставил некоторые комментарии к примеру кода.
Для получения более актуальной информации вы можете проверить эту документацию:
спасибо, marc за вашу помощь и за то, что сэкономили мое время, я знал об этом решении, но я думал, что смогу сделать это, только подписавшись на изменения