React 좋아요 누를때마다 1씩 증가하는 버튼 만들기
·
Programming/React
state, 함수 이용 좋아요 버튼을 누르면 숫자가 올라가게끔 만들 것이다. 이때 숫자는 누르는 횟수만큼 +1이 되기 때문에 state를 써줄 것이다. 1단계 : 형태만 만들기 import {useState} from "react"; function App() { let [heart] =useState(0); return ( 좋아요 ❤️ {heart} ); } 2단계 : 좋아요를 눌렀을 때 0이 1로 바뀌도록 (onClick 사용) import {useState} from "react"; function App() { let [heart, heartAlterNums] =useState(0); return ( 좋아요 hearAlterNums(1)}> ❤️ {heart} ); } 3단계 : 누를때마다 +1이..
state란? 왜 쓰는 것일까? destructuring?
·
Programming/React
1. 왜 state를 써야할까 변수로 설정했을때는 값이 바뀌면 값이 바뀐 것으로 실행해야한다고 다시 코드 작성해야한다. 하지만 state로 만들어서 변수로 선언해주면 state는 자동으로 HTML을 전체 적으로 다시 젠더링 해주는 기능이 있기때문에 따로 작업을 안해도 된다. 즉 : 자주 변경될 것 같은 HTML 부분을 state로 만들어 두면 됨 - 변수 설정 후 값을 바꿀때 let post = '강남 우동 맛집' ---> '역삼 우동 맛집' return( #추가추가추가 작업 어쩌구 저쩌구 {post} ); } - state 설정 후 값을 바꿀때 let [a,b] = useState('남자 코트 추천'); ----> '여자 코트 추천' return( {a} ); } 2. state 사용방법 import ..
var 대신 const 와 let으로 변수선언하기
·
Programming/React
이전에는 var a; var b = 1; 요렇게 var로 선언을 했다면 이제는 const c = 2; let d = 3; d =4; 로 사용하자 const 는 한 번 선언하면 값을 바꿀 수 없는 상수가 되고, let은 선언과 변경이 자유로운 변수를 의미한다. 차이점 ** const로 선언된 변수는 같은 스코드(중괄호)내에서 중복된 이름을 가질 수 없다.