useRefの使用を避ける
useRefは命令的なコードになりやすく、
Reactの宣言的なモデルと相性がよくありません。
使う前に代替手段がないか検討してください。
なぜuseRefを避けたいのか
ref.currentはミュータブルであり、レンダリングサイクルと同期しません。値の変更がUIに反映されず、予期しない挙動を起こしやすいです- 命令的なDOM操作はReactの状態管理と二重管理になりやすいです
- テストが難しくなります。DOMの状態をテストするにはDOMのセットアップが必要になります
- コンポーネントの再利用性が下がります。DOM構造に依存したロジックは別の場所で使い回しにくいです
ref.currentへの代入は「いつ読んでも最新」という暗黙の前提に依存しており、データフローが追いにくくなります
代替手段の検討
HTML標準の機能を使う
ブラウザが提供する宣言的なHTML要素や属性で解決できないか、 まず検討してください。
// Bad: useRefで開閉を命令的に管理
const deta
[Description truncada. Veja o README completo no GitHub.]