| 17 | |
| 18 | useEffect(() => { |
| 19 | const fetchPosts = async () => { |
| 20 | abortControllerRef.current?.abort(); |
| 21 | abortControllerRef.current = new AbortController(); |
| 22 | |
| 23 | setIsLoading(true); |
| 24 | |
| 25 | try { |
| 26 | const response = await fetch(`${BASE_URL}/posts?page=${page}`, { |
| 27 | signal: abortControllerRef.current?.signal, |
| 28 | }); |
| 29 | const posts = (await response.json()) as Post[]; |
| 30 | setPosts(posts); |
| 31 | } catch (e: any) { |
| 32 | if (e.name === "AbortError") { |
| 33 | console.log("Aborted"); |
| 34 | return; |
| 35 | } |
| 36 | |
| 37 | setError(e); |
| 38 | } finally { |
| 39 | setIsLoading(false); |
| 40 | } |
| 41 | }; |
| 42 | |
| 43 | fetchPosts(); |
| 44 | }, [page]); |