본문 바로가기

State2

[React] state를 이용해 간단한 count 기능을 만들어보자 오늘 만들 것은 버튼을 눌렀을 때마다 카운트가 1씩 증가하는 기능을 React의 state를 이용하여 만들어 볼 것이다. 1. 틀 만들기 일단 기본적인 틀을 잡고 시작하자. import React from 'react'; import './App.css' export default function App() { return ( 0 증가 ) } 현재 카운트를 보여줄 div 박스 하나와 버튼 하나를 만들어 주었다. 2. 변수 설정과 클릭 이벤트를 주자 여기서 우리가 하고 싶은 것은 버튼을 클릭하면 div박스에 있는 숫자가 계속해서 증가하는 것이다. div박스 안에 있는 숫자가 계속 변해야 하기때문에 우리의 div박스 안의 값을 변수로 만들어 주어야 한다. 또한 클릭했을 때 어떤 이벤트가 일어나야 하기 때문에.. 2023. 2. 3.
[React] React의 state란? state란? 일반적으로 컴포넌트의 내부에서 변경 가능한 데이터를 관리해야할 때에 사용 한다. 값을 저장하거나 변경할 수 있는 객체로 보통 이벤트와 함께 사용된다. 컴포넌트에서 동적인 값을 상태(state)라고 부르며, 동적인 데이터를 다룰 때 사용된다 볼 수 있다. props와 state의 차이점은? (리액트 페이지에 나와있는 내용이다. 자세하게 알고 싶다면 아래 링크) https://ko.reactjs.org/docs/faq-state.html 컴포넌트 State – React A JavaScript library for building user interfaces ko.reactjs.org 사용방법 const [state, setState] = useState(initialState); const .. 2023. 1. 30.