문제

타입스크립트에서 react-router-dom v6로 작업 중이다. react-router의 useLocation을 이용해서 state 값을 넘겨주려고 했는데 type unknown 오류가 났다. useLocation에 인터페이스를 지정해도 오류가 나고 location.state에 지정해도 오류가 나고 뭔 짓을 해도 unknown 속성에 접근할 수 없다고 한다... 타입스크립트를 처음 써보니 머리가 반으로 갈라질거 같다.

해결

react-router-dom이 v6로 넘어오면서 location의 state 속성이 무조건 unknown으로 넘어오게 바뀌었단다.

https://github.com/reach/router/issues/414#issuecomment-859406190

여기 내용을 보면 다음과 같다.

interface CustomizedState {
  myState: string
}

const location = useLocation();
const state = location.state as CustomizedState; // Type Casting, then you can get the params passed via router
const { myState } = state;

무슨 타입인지 알수 없으니 알아서 지정하라는 것 같은데 useLocation<CustomizedState>()로 되던걸 왜 없앴는지 모르겠다.
as 문법을 사용해서 해결할 수 있다는 것도 한참을 구글링해서 발견...
react-router v6가 아직 많이 사용되지 않는가보다...