# useState
.png?w=120)
useState와 비동기
하위 컴포넌트의 상태를 갖고 있는 상위 컴포넌트가 있다. 저번에도 포스팅 했던것 같다. 계속 구현하다보니 뭔가 이상한점이 발견되었다.와 같이 코드를 작성했다. 콜백으로 내려간 someHandler가 SomeComonent에서 상태를 잘 가져오고 있는지 보려고 콘솔을 찍
TIL React | 검색기능
모든 코드에 의미를 담겠습니다.지금까지 내가 구현한 자유게시판에는 Pagination 기능과 게시물을 등록할 수 있는 기능까지만 올림차순으로 정리해놓고 내용을 클릭하면 등록한 게시판으로 넘어갈 수 있는 구조를 만들어 놓았다.여기서 금일에 추가한 내용은 검색을 하였을 때
useState
const변경할 값,변경할 값의 사용자 정의 = useState('초깃값')ex) constincrease, setIncrease = useState(0)
TIL 79 | useState, useRef로 변수 관리
React 컴포넌트 내부에 어떤 값을 관리하고자할 때 사용할 수 있는 방법 3가지를 발견했다. 일반 변수 선언 방식, useState, useRef를 전부 적용해본 과정을 정리해둔다. useRef는 DOM을 선택하여 값을 추출하는데 주로 사용되는 Hook이지만 컴포넌
useState 사용해서 여러 개의 input 관리하기
객체를 업데이트 할 때에는 스프레드 문법을 사용해 객체를 복사한 뒤 그 위에 덮어씌우는 방식으로 업데이트 해야한다.
useState
상태 값 변경 함수가 2번 쓰였기 때문에 클릭을 할 때 +2가 한 번에 된다고 생각했다. ex) 0 => 2 => 4 => 6 => ....내가 예상했던 거와는 달리 클릭을 할 때 마다 +1이 된다.ex) 1 => 2 => 3 => 4 => ....상태 값 변경 함수
.jpg?w=120)
[React] useState hook 사용법
리액트 훅을 사용하는 분들은 비교적 당연하게 useState를 사용하고 있을 것이다.component를 나눠서 function을 이용하여 만드는 경우를 많이 볼 수 있다.하지만 이는 몇 년전, 리액트 버전 16.8 이전까지만 해도 function component 안에
자식 컴포넌트에서 부모 컴포넌트로 값 전달하기
부모 컴포넌트에서 자식 컴포넌트로 전달하는건 간단하다. 그럼 반대로 자식 컴포넌트에서 부모 컴포넌트로 전달하는 것은 어떻게 할까?준비물: useState부모 컴포넌트에서 자식 컴포넌트로 props에다가 state 변경 함수를 전달한다. 자식 컴포넌트에는 props로 전
[React] input 값 불변성 지키며 객체로 관리하기
"벨로퍼트와 함께하는 모던 리액트"의 "input 상태 관리하기"와 "여러개의 input 상태 관리하기"를 읽고 정리한 글입니다.
[React] 최적화를 고려하며 useState 사용하기
"벨로퍼트와 함께하는 모던 리액트"의 "useState 를 통해 컴포넌트에서 바뀌는 값 관리하기"를 읽고 정리한 글입니다.
[react] FE 로그인/회원가입 구현 useState
//앱 미리보기 ⬆️//리액트 프로젝트 '버튼 하나에 두 가지 경로 넣기 react-router-dom/useState'에서 이어집니다.왓챠 UI를 참고하여 FE를 구현하도록 하겠습니다.client/src/components/LoginPage.js 생성client/sr
[JS] 구조분해할당
구조분해할당..정말 입에 안 붙는 단어이다 그치만 단어는 참...정이안가지만, 유용함 만큼은 만점이다! 공식문서에 따르면 구조분해할당이란? 구조 분해 할당 구문은 배열이나 객체의 속성을 해체하여 그 값을 개별 변수에 담을 수 있게 하는 JavaScript 표현식이라
React Hook(useState)
useState의 첫번째 매개변수로 state의 초기값을 설정한다. 그리고 컴포넌트 상태를 바꾸고 싶을 때마다 setState 함수의 첫번째 매개변수로 바꿔줄 값을 넘겨주면 다음 렌더링 시 새로운 상태가 컴포넌트에 반영된다. setState의 첫번째 매개변수로 함수를
[React] 함수형 컴포넌트에서 state사용하기
배열 안에 들어 있는 값을 쉽게 추출할 수 있도록 해주는 문법 해당 컴포넌트를 App.js에서 불러오는 부분은 앞의 포스트에서와 다른 부분이 없으니 앞으로의 포스트에서는 특별히 다른점이 없다면 생략한다.useState는 한 컴포넌트에서 여러 번 사용해도 상관없다.
