TIL) 노마드코더 ReactJS 초보강의: useEffect 활용, button 태그 응용

useEffect 활용

useEffect란

useEffect(함수, [keyword])

특정 부분만 re-rendering 되게 하고 싶을 때 사용.

keyword 값이 변경될 때만 함수부분을 re-render할 수 있음.

변경할 때 참고하고 싶은 값으로 여러 개를 넣어줄 수 있음.

cleanup function

useEffect(() => {
    console.log('created');
    return () => console.log('destroyed')
}, [])

component(함수)가 destroy 될 때 호출되는 함수
useEffect 인자 함수의 return 함수로 작성


<form> 태그
- 웹페이지에서 입력 양식을 만들 때 사용하는 추상적 태그 양식
- 하위 <input> 태그 등을 통해 사용자가 데이터를 기입할 수 있도록 작성필요
- submit 속성이 있으며, submit을 하면 백 엔드 서버에 양식 전달


... : three dot 사용

const food = [1,2,3,4]
[6, ...food] // [6,1,2,3,4]

<hr />
- 가로로 줄 긋기

button 태그에서 props로 index 받아오기

<button onClick={() => onClick(index)}>Done</button>