alex im

https://ko.reactjs.org/docs/hooks-reference.html#useref useRef는 .current 프로퍼티로 전달된 인자(initialValue)로 초기화된 변경 가능한 ref 객체를 반환합니다. 반환된 객체는 컴포넌트의 전 생애주기를 통해 유지될 것입니다. MutableRefObject는 HTML DOM 요소에 접근할 수 있게 하는 기능을 한다. input에 ref={authorInput} 을 넣어주고 onChange 함수인 handleSubmit에서 authorInput.current.focus() 를 넣어주게 되면 저 조건을 만족시켰을 경우 input에 focus가 생기게 된다.

import { useState } from "react"; const DiaryEditor = () => { const [state, setState] = useState({ author: "", content: "", }) const handleChangeState = (e) => { setState({ ...state, [e.target.name]: e.target.value, }) } return ( 오늘의 일기 ) } export default DiaryEditor; handleChangeState의 setState에 ...state를 밑으로 위치를 바꾸면 안된다. state값의 기본값이 "" 이기 때문에 ""에서 변하지 않게되므로 ...state의 위치를 첫번째에 위치 시켜야한다. import..

1. class 컴포넌트 2. 함수 컴포넌트 - this 쓸 일이 없다. - 코드 짧고 가독성이 더 좋음 출처 https://www.youtube.com/watch?v=Sph9Pqi1Mz0

📗 States - 리액트는 데이터 중심으로 움직인다. (데이터와 화면의 일치) - component는 데이터, 화면을 하나로 묶어놓은 것이고 화면에서 바뀔 부분을 state로 만든다. 📗 state와 props - props(properties) 와 state는 일반 JavsScript 객체이다. - 두 객체 모두 렌더링 결과물에 영향을 주는 정보를 가지고 있다. (컴포넌트의 render() 함수를 위한 입력 데이터라고 말할 수 있다.) - props와 state는 HTML 출력이 나오는 "raw data"를 구성한다. 📗 state와 props의 차이점 - props는 함수 매개변수처럼 컴포넌트에 "전달"되는 반면 state는 (함수 내에 선언된 변수처럼) 컴포넌트 "안"에서 관리된다. - compo..