개발하자(DevHaja)

FrontEnd/React & React-Native

[React] Hooks : useEffect( )

📝 useEffect useEffect는 리액트 컴포넌트가 렌더링될 때마다 특정 작업을 수행하도록 설정하는 Hook입니다. 클래스형 컴포넌트의 componentDidMount와 componentDidUpdate를 합친 형태로 보아도 무방합니다. 📜 useEffect 활용 import { useState, useEffect } from 'react'; const Info = () => { let [name, setName] = useState(''); let [nickName, setNickName] = useState(''); useEffect(() => { console.log('렌더링 완료'); console.log({ name, nickName }); }); const onChangeName = (..

FrontEnd/React & React-Native

[React] Hooks : useState( )

📝 useState 리액트 컴포넌트에서 동적인 값을 상태(state)라고 부릅니다. 사용자 인터렉션을 통해 컴포넌트의 상태값이 동적으로 바뀔 경우에는 상태를 관리하는 것이 필요합니다. useState는 가장 기본적인 Hook이며, 함수형 컴포넌트에서도 가변적인 상태를 지닐 수 있게 해 줍니다. 📜 useState 활용 import { useState } from 'react'; const Counter = () => { let [count, setCount] = useState(0); return( { count } {setCount(count + 1)}}>+1 {setCount(count - 1)}}>-1 ) }; export default Counter; useState는 상단에 import 구문을 ..

devwoodie
'hooks' 태그의 글 목록