8/13 프로젝트 버그 수정 중 알게 된 것들

ref 사용 시, input 초기값 설정

controlled component = value + onChange → react가 제어, 입력값 상태로 유지

uncontorlled component = defaultValue → DOM에 직접 접근

 

Object.keys(res).length

>> "res(객체)에 요소가 있으면" 이라는 조건이 필요했는데 습관처럼 res.length 사용해서 undefined 나옴 

 

res는 객체 (배열이 아님) ⇒ res.length는 undefined가 될 수 있다

Object.keys는 객체 속성 이름을 배열로 반환

const object1 = {
  a: 'somestring',
  b: 42,
  c: false,
};

console.log(Object.keys(object1)); // Array ["a", "b", "c"]

 

const userData : {[key: string] : string} = {}

{ [key: string]: string }

= index signature

객체의 key-value를 동적으로 정의하는 방법

모든 속성이 동일한 타입일 때

 

const userData: { [key: string]: string } = { email };

email을 미리 할당

 

invalidateQueries vs removeQueries

>> 로그아웃 시, 유저 정보를 removeQueries

 

queryClient.invalidateQueries

쿼리를 무효화할 뿐, 메모리에서 제거하지 않음

 

*무효화

mutation을 성공하면, 이로 인한 새로운 변경 사항을 설명하기 위해 무효화하고 다시 가져와야하는 가능성이 매우 높음

 

queryClient.removeQueries({ queryKey: ['loggedUser'] })

loggedUser 키를 가진 쿼리를 메모리에서 삭제