Javascript/typescript

[typescript][react] string' 형식의 매개 변수가 포함된 인덱스 시그니처를 찾을 수 없습니다.

킹king 2024. 7. 3. 17:23
반응형

object로 된 요소를 바꾸려는데 저런 멘트가 뜬다면 타입으로 확실하게 명시해주면 된다.

 

1. 타입 정리

interface Isomething { // 이거
  [key: string]: boolean;
}
const [something, setSomething] = useState<Isomething>({
  a: false,
  b: true,
})

 

여담으로 react에서 set함수로 변경할때 object를 어떻게 일괄/일부 변경하는지 적어두겠음.

 

const [something, setSomething] = useState<Isomething>({
  all: false,
  a: false,
  b: true,
});

// all의 상태에 따라 싹다 토글. 전체선택,해제 같은거에서 씀.
const toggleAll = () => {
  const keyy = Object.keys(something);
  const allState = !something.all;
  setSomething(prevState => {
    const s: typeof prevState = {};

    keyy.forEach(key => {
      s[key] = allState;
    });

    return s;
  });
}

// 걔만 상태 바꾸는 것. 체크박스 하나만 선택했을때 같은거에서 씀.
// type으로 a라고 쓰면 something.a만 반대로 바꿔줌.
const changeOne = (type: string) => {
  const key = Object.keys(something).filter((k) => k == type)[0];
  const prevState = something[type];
  setSomething((prev) => ({ ...prev, [key]: !prevState }));
}

모든 게시물(특히 과거 게시물)은 잘못된 방법으로 처리한것을 좋다고 써놨을 수 있습니다. 참고만 하시고 틀린게 있다면 댓글 남겨주세요~