[ERR] Type 'void' is not assignable to type 'string[]' 외 다수

ERR

TS2322: Type 'Dispatch<SetStateAction<string[]>>' is not assignable to type 'SetStateAction<string[]>'.
  Type 'Dispatch<SetStateAction<string[]>>' is not assignable to type '(prevState: string[]) => string[]'.
    Type 'void' is not assignable to type 'string[]'.

TS2349: This expression is not callable.
  Not all constituents of type 'SetStateAction<string[]>' are callable.
    Type 'string[]' has no call signatures.

TS2322: Type 'Dispatch<SetStateAction<string[]>>' is not assignable to type 'SetStateAction<string[]>'.
  Type 'Dispatch<SetStateAction<string[]>>' is not assignable to type '(prevState: string[]) => string[]'.
    Type 'void' is not assignable to type 'string[]'.

TS2349: This expression is not callable.
  Not all constituents of type 'SetStateAction<string[]>' are callable.
    Type 'string[]' has no call signatures.

• 거...많기도 하다...

WHEN

• 넘겨준 상태갱신 함수를 실행하는 단계에서 에러가 발생했다.

WHY

• 함수의 매개변수와 함수의 타입의 선언이 제대로 이루어지지 않아서 생기는 문제였다.
• 이전의 갱신함수 전달에서 생겼던 문제는 타입을 작성하지 않아서였고, 이번에 생긴 에러는 타입을 잘못 설정해서였다.
• 구글링을 하던 중 상태갱신함수의 타입을 발견했고, 아래와 같이 작성했으나 해당 사용법이 올바르지 못했다.

interface IProps {
  todoList: string[];
  setTodoList: SetStateAction<string[]>;
}

SOLVE

• 아래와 같이 타입을 재 설정해주어 해결했다.

import React, { Dispatch, SetStateAction } from 'react';

interface IProps {
  todoList: string[];
  setTodoList: Dispatch<SetStateAction<string[]>>;
}

• 위의 예제는 Dispatch, SetStateAction 을 import 해서 불러왔으며, 만약 위처럼 import 하지 않고 React 만 import 한다면 아래와 같이 사용 할 수 있다.

import React from 'react';

interface IProps {
  todoList: string[];
  setTodoList: React.Dispatch<React.SetStateAction<string[]>>;
}

→ 이것도 React 떼고 쓰다가 cannot find name 에러로 발견했다 ㅎㅎ..!

• 함수의 타입을 설정 할 때 사용하는 void로도 해결이 가능하다.

interface IProps {
  todoList: string[];
  setTodoList: (arg : string[]) => void;
  // 이 경우 매개변수의 타입도 함께 설정해야한다.
}

---

• 아직은 선행으로 강의를 듣지 않고 부딪혀보는 중이다보니 무언가를 추가할 때마다 오류가 터지고 있다....
• 이렇게 에러를 만날때마다 기록해두고, 강의를 보면서 해당 부분을 더 집중해서 볼 예정!