Typescript 에러 | 객체의 key를 변수(객체키)로 접근 하기

접근하고자 하는 상수 객체

'string' 형식의 식을 인덱스 형식에 사용할 수 없으므로 요소에 암시적으로 'any' 형식이 있습니다.
'string' 형식의 매개 변수가 포함된 인덱스 시그니처를 찾을 수 없습니다.ts(7053)

 

게시판 기능을 구현 중에 카테고리 - 세부카테고리를 상수 데이터로 미리 정의하고, 사용자가 선택한 카테고리(writeBody.board_type)값에 맞는 세부카테고리를 보여주고자 했습니다. 

객체명[변수명] 이렇게 접근하면 될 줄 알았지만 타입스크립트는 호락호락하지 않았고 빨간줄을 띄며 에러를 또 내뱉엇습니다.

이 에러는 상수객체에 타입을 지정해주지 않았기에 접근할 수 없다는 에러였으며, 타입을 지정해주면 해결할 수 있었습니다.

 

---

🚧 해결 방법

interface BoardDetailType {
  [props: string]: string[];
}

export const BOARD_DETAIL_TYPE: BoardDetailType = {
  NOTICE: ['APPLE'],
  EVENT: [],
  FAQ: ['APPLE', 'BANANA'],
};

상수 객체 데이터에 [props: string]: string[]; 를 가진 타입을 지정해줍니다.

 

 

---

🚧  결과 화면

이제 state값으로 유동적으로 세부카테고리에 접근할 수 있게 되었습니다 (상쾌 -)