React Router v6.14.2 を使用して、ブラウザーのルーティングを設定するすべての手順を完了しました
index.jsxx
リーリーReact コンポーネントでデータローダーを使用する場合、コードは次のとおりです
profileList.jsx
リーリーこの方法は、アプリケーションをローカルで実行しており、ユーザーがコンソールやその他の場所で問題なく読み込んでいる場合には完全に機能します。
ただし、jest テストを実行しようとすると、次のエラー メッセージが表示されます。
useLoaderData はデータ ルーターで使用する必要があります
次のコード行をポイントします
const users = useLoaderData();
現時点では、テストは非常に簡単ですが、それでもテストが失敗します。
profile.test.js
リーリーReact Router のドキュメントを見て、その手順に正確に従ってみました。 Stack Overflow で検索しましたが、私の質問に正確に一致するものは見つかりませんでした。
P粉3641297442023-09-22 11:02:01
単体テストであっても、データ API にアクセスするコンポーネントはデータ ルーター内でレンダリングされる必要があります。 Node は DOM 環境ではないため、単体テストでは MemoryRouter (例: createMemoryRouter) を使用することをお勧めします。