React

[React] 3. fetch

재키재키 2022. 1. 29. 21:56

1. fetch

- url으로부터 json object를 받아와서 사용하는것을 fetch라고 한다. 

- fetch를 통해 받아온 object를 useState를 사용하여 저장하고 사용한다. 

- .then 문법을 사용하는 방법 

useEffect(()=>{
	fetch("https://yts.mx/api/v2/list_movies.json?minimum_rating=8.8&sort_by=year")
    .then((response) => response.json())
    .then((json) => {
    setMovies(json);
     setLoading(false);
  	});
   },[])

 

- async, await 문법을 사용하는 방법

const getMovies = async () => {
    const json = await (
      await fetch(
        `https://yts.mx/api/v2/list_movies.json?minimum_rating=8.8&sort_by=year`
      )
     ).json();
    setMovies(json.data.movies); // State에 저장 
    setLoading(false);
  };

  useEffect(() => {
    getMovies();
  }, []);