변경

목표 위 사진에서 보이는 목록에서 제목을 클릭하면, 그와 관련된 정보를 띄우는 모달이 하단에 출력되도록 하겠다. 현재는 목록의 어떤 제목을 클릭해도 아래와 같이 첫번째 제목인 '나_Hi'만 출력되는상태이다. 코드 작성 순서 1. state 생성 let [indexNum,setIndexNum] =useState(0); 동적 UI 변동을 줘야하므로 state를 사용한다. 2. state 상태 함수를 이용하여 indexNum state 값 변경 { //a는 하나씩, i는 0부터 반복될때마다 1씩 증가하는 수 글제목.map(function(a,i){ return( {setModal(!modal); setIndexNum(i)}}>{a} { let copy=[...따봉] copy[i]=따봉[i]+1 따봉변경(cop..

좋아요 버튼 & 갯수 UI 만들기 let [따봉, 따봉변경] = useState(0); state 변수를 위와 같이 정의했을 경우 {글제목[0]} {따봉변경(따봉+1)}}>👍{따봉} 위 태그에 대응되는 출력물을 클릭하면 받은 '따봉'의 갯수를 1씩 증가되도록 작성했다. onClick 속성을 사용하여 함수를 호출시켜야 하는데 ()=>{} 에서 중괄호 안에 함수이름을 작성한다. 함수 이름은 '따봉'의 state 변경용 함수인 '따봉변경'을 사용해야만 한다. array/object state 사용 방법 1) state 변수 선언 let [글제목,글제목변경] = useState(['Hi','안녕하세요','채로입니다']); 2) onClick을 통한 state 변경 함수 작성 및 버튼 생성 {글제목변경(['Hi2..