이번에는 state를 이용하여 버튼기능을 구현해보려고 한다.
import React, {useState} from 'react';
function App() {
const [글제목,글제목변경] = useState('피자 추천','치킨 추천','햄버거 추천');
return (
<div>
<p> {글제목[0]} <span> 🍪 </span> </p>
</div>
쿠기를 눌렀을 때 동작하는 것을 하려고 한다면? 바닐라 자바스크립트에서 배운 addEventListener, onclick 같은 것이 생각날 것이다.
바닐라 자바스크립트 :language-javascript"><span onClick={()=>{실행할 내용}) > 🍪 </span>
여기 실행할 내용에다가 "console.log(1)"을 넣어주기만 하면 된다. 별거없다...
그렇다면 쿠키를 누를 때마다 누른횟수가 나오게 만들어보자
Q. 쿠키를 누를 때마다 1 증가시키기
<p> {글제목[0]} <span onClick={()=>{실행할 내용})> 🍪 </span> 0 </p>
우선 state를 추가해준다.
const [쿠키,쿠키변경] = useState(0);
onClick안에 함수에 무엇을 넣어야할까?
여기서 사용할 것이 쿠키변경이라는 함수이다. 말그대로 앞에 쿠키(state)를 변경할 수 있게 해준다.<p> {글제목[0]} <span onClick={()=>{쿠키변경(쿠키+1)})> 🍪 </span> 0 </p>