목록2024/03/14 (2)
Rootable의 개발일기
📌 React의 생명주기 모든 React 컴포넌트에는 LifeCycle이 존재한다. 📢 컴포넌트의 생명주기 생성(mounting) ➡ 업데이트(updating) ➡ 제거(unmounting) 생명주기의 때에 따라 처리해야 할 작업을 지정해 줘야 불필요한 업데이트를 방지할 수 있다. React class component : 생명주기 메서드 활용 React functional component : Hook 사용 📝 생명주기 메서드 ✔ Mounting (생성) 컴포넌트의 인스턴스가 생성되어, DOM에 삽입될 때 순서대로 호출된다. 1. constructor 컴포넌트를 새로 만들 때마다 호출되는 클래스 생성자 메서드 this.props, this.state에 접근할 수 있으며 리액트 요소를 반환 setStat..
📌 useState React의 state machine에 연결하는 기본적인 방법 동적으로 바뀌는 값을 관리할 때 사용 /*기본 형태 item: state를 통해 담은 data setItem: item을 변경하는 함수 1: 초기값 (어떤 값이라도 don't care) */ const [item, setItem] = useState(1); 🔍 예제 (Counter) Increment 클릭할 때마다 item 1 증가 Decrement 클릭할 때마다 item 1 감소 function App() { const [item, setItem] = useState(1); const incrementItem = () => setItem((current) => current + 1); const decrementItem ..