STUDY/React3 [React Hooks] useEffect( ) useRef( )에 이어서 useEffect( )를 공부해보자 😀 useEffect()는 class형 컴포넌트에서 컴포넌트 생명주기 메서드인 componentDidMount, componentDidUpdate를 합친 형태다. 컴포넌트 생명주기..? 너무 어려운 말이다 공식 홈페이지 설명을 보자. Component Lifecycles useEffect 사용하기 import { useEffect } from "react" //useEffect 불러오기 useEffect의 기본 형태 useEffect(()=>{컴포넌트가 마운트 된 후 실행 시킬 함수},[의존성 배열]) useEffect는 컴포넌트가 마운트 되고 나서 처음 한번 실행된다. // componentDidMount와 동일 useEffect(() =>.. 2021. 10. 8. [React Hooks] UseRef( ) useState( ) 에 이어서 오늘 공부할 React Hook은 useRef( )이다. useRef( )란 무엇일까? 오늘도 공식문서를 찾아가 봤다. useRef는 .current 프로퍼티로 전달된 인자(initialValue)로 초기화된 변경 가능한 ref 객체를 반환합니다. 반환된 객체는 컴포넌트의 전 생애주기를 통해 유지될 것입니다. 이게 무슨 소리지..? 조금 더 자세한 설명이 필요해서 책과 다른 분들이 올린 포스팅을 찾아봤다. useRef( )는 특정 DOM에 접근할 수 있다. 그렇다면 DOM이란 정확하게 뭘까? 이건 다음에 자바스크립트 포스팅에서 다룰 예정이다. 우선 useRef( ) 사용법을 알아보자! 1. Ref 객체 만들기 const useref = useRef() 2. 선택한 DOM에.. 2021. 9. 28. [React Hooks] useState React Hook이란 무엇일까? React 홈페이지에 가면 자세한 설명이 나와있다. (https://ko.reactjs.org/docs/hooks-overview.html) 공식문서가 짱이다. 가끔 번역된 문장이 어색하지만 몇 번 읽으면 어느정도 이해할 수 있다. 근데 Hook이 뭔가요? Hook은 함수 컴포넌트에서 React state와 생명주기 기능(lifecycle features)을 “연동(hook into)“할 수 있게 해주는 함수입니다. Hook은 class 안에서는 동작하지 않습니다. 대신 class 없이 React를 사용할 수 있게 해주는 것입니다. (하지만 이미 짜놓은 컴포넌트를 모조리 재작성하는 것은 권장하지 않습니다. 대신 새로 작성하는 컴포넌트부터는 Hook을 이용하시면 됩니다.).. 2021. 9. 27. 이전 1 다음
