useFirestoreCollection triggers a double render
還沒有人認領這個 Issue。
評估
- 難度
- 3/5
- 預估耗時
- 1-2 天
- 新手友好度
- 35/100
- Issue 類型
- 缺陷
- 描述清晰度
- 基本清楚
- 活躍度
- 停滯
- 技術堆疊
- javascript, react
研究方向
先使用 useFirestoreCollection 測試案例重現此行為，並將其與類似的 useUser 行為進行比較。檢查這些 hook 的進入點，以確定為什麼使用 Suspense 擷取資料會導致 console.log 執行兩次。完成的標準是：擷取資料產生一次渲染，而後續的渲染只會在 collection 發生變更時才會發生。
由索引模型根據 Issue 內容生成。
描述
Hi,
Seems like useFirestoreCollection always triggers unnecessary render when fetching data (suspense is on). Similar behavior is also the case for useUser.
There's a chance I'm simply using the API wrong, so please advise if so :)
Version info
React: 17.0.2
Firebase: 9.1.3
ReactFire: 4.2.0
Test case
const q = /* whatever query */;
const queryResults = useFirestoreCollection(q);
console.log(queryResults);
Expected behavior
console.log is called once.
Actual behavior
console.log is called twice.
Ultimately, what I'm trying to achieve is a code similar to the one below
const queryResults = useFirestoreCollection(query);
return queryResults.data.docs.map((d) => /* render */);
that renders only once when the data is fetched (and then only when there're changes in the collection).
- 主要語言
- TypeScript
- 星號
- 3.6k
- 分支
- 403
- 平均合併
- 5 天 1 小時
- 30 天內合併 PR
- 10
貢獻指南
從這裡開始
- 先讀完整個 Issue，再讀專案的貢獻指南。
- 在 Issue 下留言說明你要接手 —— 這能避免兩個人做同樣的事。
- Fork 儲存庫，在一個分支上完成修改。
- 送出 Pull Request，並在描述裡引用這個 Issue 編號。
FirebaseExtended/reactfire 的其他 Issue
-
難度 5/5 一週以上 新手友好度 38/100
FirebaseExtended/reactfire#801 ·
-
v5
難度 4/5 3-5 天 新手友好度 48/100
FirebaseExtended/reactfire#793 ·
-
v5
難度 4/5 3-5 天 新手友好度 35/100
FirebaseExtended/reactfire#790 · 2 則留言 ·
-
v5
難度 4/5 3-5 天 新手友好度 55/100
FirebaseExtended/reactfire#789 ·
-
難度 5/5 一週以上 新手友好度 35/100
FirebaseExtended/reactfire#788 ·
查看 FirebaseExtended/reactfire 的全部 Issue
相似的 Issue
-
難度 2/5 1-3 小時 新手友好度 84/100
bcgov/bc-wallet-mobile#4761 · 1 則留言 ·
-
external-issue to-triage
難度 2/5 1-3 小時 新手友好度 88/100
-
area-deployment area-integrations triage:bot-seen
難度 2/5 半天 新手友好度 86/100
-
難度 2/5 1-3 小時 新手友好度 82/100
-
refactor
難度 2/5 1-3 小時 新手友好度 84/100