依存するAPIフェッチカスタムフックのための私の反応クエリークローン実装
5112 ワード
現在Mangadex APIを使っている反応マンガウェブサイトでの私の現在の仕事で、私は若干のメモを置きたいです
漫画の詳細を得るための私のカスタムフック
漫画の詳細を得るための私のカスタムフック
function useMangaDetail(mangaId, { enable = true } = {}) {
const [manga, setManga] = useState(null);
const [loading, setLoading] = useState(true);
useEffect(() => {
// if false then will not excute
if (!enable) {
return; // end it
}
(async () => {
try {
setLoading(true);
const result = await mangaApi.get(mangaId);
setManga(result.data);
} catch (error) {
console.log('Failed to fetch manga id=', mangaId, error);
}
setLoading(false);
})();
}, [mangaId, depEnable]);
return { manga, loading };
}
章の読書ページでは、章の詳細データからのGangAidフェッチに依存してマンガ情報を取得する必要がありますfunction ChapterReadPage() {
const { chapterId } = useParams();
const { chapter, mangaId: mangaIdOfChapter } = useChapterDetail(chapterId);
const { manga } = useMangaDetail(mangaIdOfChapter, { enable: !!mangaIdOfChapter });
const mangaEnTitle = manga?.attributes?.title?.en;
return (
...
);
}
Reference
この問題について(依存するAPIフェッチカスタムフックのための私の反応クエリークローン実装), 我々は、より多くの情報をここで見つけました https://dev.to/nguyenit67/my-nothing-special-implementation-for-dependant-api-fetching-custom-hooks-g39テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol