임이지의 블로그

Using the State Hook state hook 사용하는 방법을 알아 봅시다. Hook과 같은 기능을 하는 클래스 예시 React에서 클래스형 컴포넌트를 사용해봤다면, 아래의 코드는 익숙할 겁니다. class Example extends React.Component { constructor(props) { super(props); this.state = { count: 0 }; } render() { return ( You clicked {this.state.count} times this.setState({ count: this.state.count + 1 })}> Click me ); } } 위 코드에서는 state는 { count : 0 }이며 사용자가 this.setState() 를 호출..

Web/REACT 2021. 11. 3. 11:32

HOOK은 React 버전 16.8부터 React 요소로 새로 추가 되었습니다. Hook을 이용하여 기존 Class 바탕의 코드를 작성할 필요 없이 상태 값과 여러 React의 기능을 사용할 수 있습니다. 리액트 16.8 이전 버전에서는 함수형 컴포넌트에서는 상태를 관리할 수 없었습니다. 리액트 16.8 에서 Hooks 라는 기능이 도입되면서 함수형 컴포넌트에서도 상태를 관리할 수 있게 되었습니다. 리액트에서 HOOK을 사용하는 이유는 functional component 에서 state를 가질 수 있게 합니다. 기존의 react 에서는 class component, did mount, render 이런것을 안해도 된다. 모든 것은 하나의 function 이 된다. 함수형 프로그래밍으로 모든 것을 할 수..

Web/REACT 2021. 10. 31. 19:49