Recoil에서 만든 변수(배열)를 불러와 사용하는데 다음과 같은 Typescript에러가 발생하였다.
'number' 형식의 인수는 'never' 형식의 매개 변수에 할당될 수 없습니다.
코드는 다음과 같다.
<atom.ts>
export const wins = atom({
key: "wins",
default: [],
});
<App.tsx>
const [win, setWins] = useRecoilState(wins);
if (win.includes(gameId)) {
console.log("hi");
} else {
setWins([...win, gameId]);
//이전 값 + 새로운 값
}
이러한 에러는 배열 유형을 정의하지 않아 never 형식으로 정의되었기 때문에 발생하는 것이다.
그러므로 배열 유형을 정의하여 주면 되는데, 기본적으로 다음과 같다.
// 문자열만 가지는 배열
let arr01: string[] = ['a', 'b', 'c'];
let arr02: Array<string> = ['a', 'b', 'c'];
// 숫자형만 가지는 배열
let arr03: number[] = [1, 2, 3];
let arr04: Array<number> = [1, 2, 3]
그런데 recoil에서는 위와 같이 형식을 정의해주면 에러가 뜬다.
export const wins = atom({
key: "wins",
default:number[] = []
//에러!
});
그러므로 다음과 같이 any로 설정해주자.
export const wins = atom({
key: "wins",
default: [] as any,
});
useState에서도 다음과 같이 쓸 수 있다.
const [text, setText] = useState([] as any);
setText((prev: any) => [newText, ...prev]);