React UseEffect를 이용한 with DB 초기 값 설정

Cherry_Brian·2023년 3월 30일
0
post-thumbnail

문제 - React DB 연동시 초기 값을 불러와 저장

const [tableRows, setTableRows] = useState([]);
//초기 값을 넣을 state 설정, DB에서 불러오는 값이 배열 형태이기에 빈 배열로 초기화.

useEffect(() => {
    const tempData = async () => {
      await axios.get('/dao/mongo/selectTest').
        then((res) => {
          const result = res.data;
          setTableRows(result.result)
        })
    }
    tempData();
  }, [])

useEffect의 경우 2개의 파라미터를 가지는데 첫번 째 파라미터는 실행되는 명령어가 들어가 있고, 두번 째 파라미터는 추적할 값을 지정한다. 해당 값의 변동이 발생하게 되면 해당 값이 속한 useEffect가 실행된다.

처음 한번 useEfect를 실행하기 위해서는 두번째 파라미터에 빈 배열 []을 지정해주면 된다.

restAPI를 통해 DB에서 값을 가져와 해당 값을 setState를 통해 지정해준다.

0개의 댓글