반응형
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 }));
}
'Javascript > typescript' 카테고리의 다른 글
[typescript] 'unknown' 형식은 '~~' 형식에 할당할 수 없습니다. (0) | 2024.07.15 |
---|---|
[typescript] 'Timeout' 형식은 'void' 형식에 할당할 수 없습니다. (0) | 2024.03.25 |
[react][typescript] 'React'는 UMD 전역을 참조하지만 현재 파일은 모듈입니다. (0) | 2024.03.14 |
[typescript] 'this'에는 형식 주석이 없으므로 암시적으로 'any' 형식이 포함됩니다. (0) | 2024.03.13 |
[typescript] 'Element' 형식에 'style' 속성이 없습니다 (0) | 2024.02.19 |