Property 'oo' does not exist on type 'oo'. 타입스크립트 error 해결

TodoItem컴포넌트 props item에 type을 정의해줬는데 Property 'item' does not exist on type 'ITodoItem'. 라고 error가 났다. 그니까 ITodoItem 인터페이스에 porps item에 대한 type이 존재하지 않는다 뭐 이런 오류인거 같은데.. 분명 타입 정의를 해줬는데 왜 안되지 하면서 별의별 시도를 해보다가 원인을 알게됨.

TodoItem컴포넌트에서 props item이 빈객체로 인식되기 때문에 프로퍼티에 type이 없다~~~이렇게 에러를 내뿜는것..
List컴포넌트에서 TodoItem컴포넌트에 props를 넘겨줘야 객체 프로퍼티가 들어오기 때문에 빈객체인게 당연했다. 

 

interface ITodoItem {
  [key: string]: any
  // id: number,
  // text: string,
  // isComplete: boolean
}

 

이렇게 어떤 프로퍼티가 들어올지 모르는 경우에 Index Signatures 구문을 사용하면 해결.

 

interface ITodoItem {
  [key: string]: string | number
  // id: number,
  // text: string,
  // isComplete: boolean
}

만약 key와 값의 타입을 아는 경우는 위와같이 설정해주면 된다

 

 

https://www.typescriptlang.org/docs/handbook/2/objects.html#index-signatures
https://bobbyhadz.com/blog/typescript-property-does-not-exist-on-type-object

Documentation - Object Types

Property does not exist on type Object in TypeScript | bobbyhadz