Promise や Context から値を読み取る use React フック

React の Canary および experimental チャンネルでのみ利用可能な `use` フックについて解説します。`use` フックは Promise や Context から値を読み取るためのフックで、Promise の値を同期的に読み取ることができます。その他の React フックと異なり、`if` 文やループ内で呼び出すことができる点が特徴として挙げられます。 use は、Promise や Context から値を読み取るための React フックです。以下のコードのように Promise の値を同期的に読み取ることができます。 import { use } from "react"; const fetchUsers = async () => { const response = await fetch("/api/users"); return respons

[IzumiSy]

なおNext.jsではおそらくポリフィルがあたっているかなにかでuse APIはもう使える。細かいパターンベースのinvalidationとかがいらなければcache APIの代替としてmoizeかなんかで適当にキャッシュをするのもアリ。

[shingo-sasaki-0529]

Suspense だけじゃダメなんだっけって思ったけど、素で Suspense を使う場合のツラミが説明されててわかりやすかった。

[hinaloe]

use hook、ググらビリティとても低いのには困らさせられてる

[otchy210]

便利そうなのはよく分かったけど、`use` って名前が一般名称すぎん？とは思った。async 関数や Context の他にも色んなものを受けられるように拡張していく方針なのかもしれないけども。

[akymrk]

“`if` 文やループ内で呼び出すことができる”"Canary および experimental チャンネルでのみ""use フックは Promise の値を同期的に読み取ることができる""クライアントコンポーネントでデータフェッチを行う場合に使用"

[Shinwiki]

それってもうなんつーかマルチスレッド的なの拡大して応用した方がよくねえか

[jay-es]

Promise の値を同期的に読み込める。他のフックと違い、if 文の中などでも使える。リクエストは cache 関数などでキャッシュするのが望ましい。Context の読み込みにも使える