背景：這是一個練習待辦事項串列應用程式，我使用 onValue 來監聽實時資料庫中待辦事項串列的更改，然后將其映射到前端的任務陣列上。
我以前在以下列方式使用 onValue 時出現記憶體泄漏錯誤 - 當我沒有取消訂閱 onValue 偵聽器時：
useEffect(
() => {
if (user) {
onValue(ref(database, `users/${user}/tasks`), (snapshot) => {
const todos = snapshot.val();
const tasks = [];
for (let id in todos) {
tasks.push({ ...todos[id], id: id })
}
setTasks(tasks)
})
} else {
setTasks([])
}
}, [user])
我從這里的其他一些問題中看到 onValue 回傳一個取消訂閱函式，我還看到了一個答案，通過向 onValue 行添加回傳，我可以取消訂閱它 - 我嘗試在下面執行此操作：
useEffect(
() => {
if (user) {
return onValue(ref(database, `users/${user}/tasks`), (snapshot) => {
const todos = snapshot.val();
const tasks = [];
for (let id in todos) {
tasks.push({ ...todos[id], id: id })
}
setTasks(tasks)
})
} else {
setTasks([])
}
}, [user])
它似乎對我有用，但我能得到一些幫助來確認這是取消訂閱這個 onValue 偵聽器的正確方法嗎？
uj5u.com熱心網友回復：
您的useEffect回呼需要回傳一個取消訂閱函式，以便 React 可以在不再需要組件/鉤子時呼叫它。通過從 回傳回傳值onValue，您可以確保在onValue不再需要組件/掛鉤時取消訂閱。如果這就是您想要完成的（似乎是這種情況），那么這確實看起來是正確的。
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/376802.html
標籤：javascript 反应 反应原生 火力实时数据库