Next.js で React Suspense が使えない

この前、Next.js で React Suspense を使おうとしたんです。

そしたら以下のエラーが出てしまいました。

Error: ReactDOMServer does not yet support Suspense.

この方も、エラーが出て困っているようです。

Next.js で React.Suspense 使うのどうやるんだろ？

SSR だと ReactDOMServer does not yet support Suspense. エラーが出ちゃう。

— Yuji Tsuburaya (@___35d) January 3, 2021

以下のように switch を使えばいいようです。

[NextJS / SSR] Can’t use useRecoilValue in async selectors (ReactDOM does not yet support Suspense)
https://github.com/facebookexperimental/Recoil/issues/722

これで何で動くのか正直よくわかりませんが。。。

const userNameLoadable = useRecoilValueLoadable(userNameQuery(userID));
switch (userNameLoadable.state) {
case ‘hasValue’:
return

{userNameLoadable.contents}

;
case ‘loading’:
return

Loading…

;
case ‘hasError’:
throw userNameLoadable.contents;
}

Next.js は SSR なので、ちょっと勝手が違うのっでしょうか？
not yet support なので、そのうちサポートすると言ってるようにも判断できます。

Next.js がバージョンアップして Suspense を正式サポートするまで待った方がいいかもですね。

今日も世界は平和です。