Jaeilit

변경 전에는 useState를 반복적으로 인풋만큼 4개를 사용했다. 하지만 여러개를 하나로 압축시키는 법을 알고 나서는 하나로 썼다. 하나로 하는 방법 useState 하나에 값을 userid, username, password 등 나열한다. 이 값들은 input 의 name 속성과 일치해야 할 것이다. 그 inputvalue 들을 비구조화 할당으로 하나씩 까놓고 onChange 함수에 e.target.value 를 이용해서 e.target 또 한 까놓는다. name과 value로 지금 그 name은 아까 인풋의 name과 일치해놓은 그 부분이고 value는 값이 된다. 바뀐 값을 받아 올 setInputValue({}) 안의 불변성을 위해서 ...inputValue를 한번 불러온 뒤에 해당 값만 덮어씌..

Components.defaultProps defaultProps 프로퍼티를 할당함으로써 props 의 초기값을 정의할 수 있습니다. 공식문서 : https://ko.reactjs.org/docs/typechecking-with-proptypes.html 1. defaultProps 설정 2. props 로 받아와서 사용하기 3. Inputs 컴포넌트에서 props 값(label, placeholder, _onChange) 들을 입력 해준다. 4. 개발자도구 react components 를 살펴보면 prop로 넘겨주는 값들을 확인 할 수 있다. (콘솔 안찍어도 됨) 요거를 자식 컴포넌트에서부터 코드를 작성하다보니 이해하는데 엄청난 시간이 걸렸으나 내 나름대로 정리해보면 1. 핵심은 props 는 부모가..

1. 현재까지 사용 한 라이브러리 styled.components styled.reset react-router-dom (Link) useEffect, useState, useRef 2. 컴포넌트 구성 Home (제목) Inputs (입력 창) Btns(수정 삭제 버튼 그룹) 2-1. 컴포넌트 설명 Header 가 없는 관계로 Home 컴포넌트에 TodoList 라는 제목을 넣어주었습니다. Link 로 홈으로 연결 시켜줬습니다. 더보기 잠깐 알고 가는 a Tag 와 Link to 의 차이점 https://gomgomkim.tistory.com/9 a 태그는 새로 렌더링을 하기 때문에 속도저하와 SPA 와는 어울리지 않는다. Link 는 페이지 전부를 새로 렌더링하지 않고 주소 값만 바꿔준다. 눈속임이랄까..