04/03-1[ref:DOM]

ref[reference] : 콜백 함수를 통한 ref 설정

this.콜백함수이름=React.createRef() //Ref 생성-constructor 구간에 생성
input에 ref={this.콜백함수이름 지정}
button onClick=화살표함수={()=>{consolg.log(this.콜백함수이름)}}

식으로 해보면 current에 접근한 것이 확인된다. 여기서 .current까지 가야 input 태그에 접근한다. 예를 들어 버튼을 클릭했을 때 input의 색을 빨간색으로 지정하고 싶다면 button 화살표 함수 실행파트에

this.콜백함수이름.current.style.color

와 같이 확실하게 지정해주면 된다. 컴포넌트도 가능하며 import로 불러오는 과정만 추가된다.

컴포넌트 반복

Map() 함수 : 배열 내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환

새 배열이름=기존배열이름.map((value,index,array)=>{return 값}) 형태

key : 배열을 map() 함수를 이용하여 호출 할 때 update를 최소화 하기 위해 key 값을 작성해준다. id 값을 작성해주는 것을 권장