アカウント登録を行い、Djangoに連携して、管理画面から確認したい。
アカウント登録画面で新規登録ボタンを押下すると、以下のエラーメッセージが出ます。
Unhandled Runtime Error
Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.
Check the render method of `Register`.
はるさんのコードと同じ。
・名前つきimport / export と default import / export をごっちゃにしていないか確認
・register.jsで定義したRegister関数は、どこでDjangoと連携できているのか教えていただきたいです。
私も同じ現象が起きました。
このように、Ovalを直接インポートすると、エラーが解決しましたのでご参考ください。
import Loader from 'react-loader-spinner';
...
<Loader type="Oval" color="#f59e00" width={50} height={50} />
↓
import { Oval } from 'react-loader-spinner';
...
<Oval color="#f59e00" width={50} height={50} />
リポジトリのReadme にも同様の形式でサンプルコードが記載されています。
ありがとうございます!
私も無事に解決しました!!
もしよろしければ、どうやって解決に至ったかも教えていただけないでしょうか?
(私は色々なパターンでググってみましたが解決できなかったので、、、)
アカウント登録画面で送信ボタンを押すと、actionsのregister関数を通って、下記のファイルでDjangoのAPIをコールしています。
pages/api/account/register.js
各場所にconsole.logを書いて、どこまで実行されているのか確認してみてください。
https://zenn.dev/hathle/books/next-drf-membership-book/viewer/15_register