[Suggestion]: remove the caveat for writing ref in render path
還沒有人認領這個 Issue。
- 主要語言
- JavaScript
- 星號
- 11.8k
- 分支
- 7.9k
- 平均合併
- 1 天 11 小時
- 30 天內合併 PR
- 11
描述
Summary
In the doc for ref https://react.dev/reference/react/useRef#caveats, it calls out to not read/write ref in rendering phase without a very clear "bad example"
Page
No response
Details
However, there is use case where the caller just needs a static ref at component level to wrap a dynamic value: for example, I need to read/write a static ref in rendering path (keep it in-sync with the current render context value)
In another word, the argument could be "a need to read/sync a "render context" value into a static variable attached to the functional component", + the "ref" value is not use in the "return" of the functional component
const { componentId, renderId } = useContext(componentContext);
const context = { componentId, renderId } <--- dynamic
const contextRef = useRef(context); <--- static
contextRef.current = context;
useQuery({
context: contextRef <--- static ref to avoid equal check, the ref value is only used for logging
})
e.g. https://github.com/apollographql/apollo-client/issues/11835
and there are popular library like useLatest implemented by writing ref in render path
Can we remove or update the caveat to make it more clear? E.g. adding
If you don't attempt to use the "mutable" ref in determining the function return, it is fine to use it to sync rendering context
貢獻指南
從這裡開始
- 先讀完整個 Issue,再讀專案的貢獻指南。
- 在 Issue 下留言說明你要接手 —— 這能避免兩個人做同樣的事。
- Fork 儲存庫,在一個分支上完成修改。
- 送出 Pull Request,並在描述裡引用這個 Issue 編號。
研究方向
查看 https://react.dev/reference/react/useRef#caveats 中關於 useRef 的注意事項部分,並將其中的指引與報告中連結的 Apollo Client issue 和 useLatest 實作進行比較。釐清對於在渲染期間同步、但不影響元件回傳值的 refs,該注意事項是否應予以移除或修訂,接著更新文件並確認最終措辭沒有歧義。
由索引模型根據 Issue 內容生成。
評估
- 技術堆疊
- javascript, react
- 領域
- documentation
- Issue 類型
- 文件
- 難度
- 3/5
- 預估耗時
- 1-2 天
- 活躍度
- 停滯
- 描述清晰度
- 基本清楚
- 新手友好度
- 35/100