[Flutter] GoRouter 페이지 초기화

go_router를 사용하면서 오늘 해결한 문제점에 대해 정리 및 공유할 겸 글을 써본다.

오늘 업무 중 리스트의 CRUD를 구현하는 업무가 있어 작업을 하던 중, Delete 기능을 만드는 과정에서 문제가 발생했다.
문제가 발생한 상황은 아래와 같았다.

1. A페이지의 목록에 로딩된 아이템 중 하나 클릭해 B페이지로 이동한다.
2. B페이지에서 아이템 삭제 버튼을 클릭한다.
3. 데이터가 삭제된 후 A페이지로 돌아간다.
4. (문제 발생 지점) 삭제된 아이템이 목록에 그래도 남아있다?

분명 서버에 삭제 요청을 했고 async, await을 통해 삭제가 된 것을 확인 한 뒤 A페이지로 돌아왔지만 화면에는 삭제한 아이템이 그래도 남아있었다.

원인

원인은 B페이지로 이동한 뒤에도 A페이지는 자신의 상태를 기억하고 있었다는 점이었다.
아마 go_router를 사용하면서 context.go() 함수를 사용했는데, 이 행위가 A페이지의 상태를 히스토리에 저장해준 것으로 보인다.

개인적으로 신기했던 점은 context.go()는 히스토리를 스택으로 계속 쌓아가는데, context.pop()이 아닌 context.go()함수만 이용해 히스토리 스택에 pop이 아닌 push를 했음에도 상태를 기억한다는 점이었다.
(새로운 상태를 추가해야하지 않을까 생각했다.)

해결방법

상태가 변하지 않는 페이지에 UniqueKey()를 이용한 키 값을 넣어주면 된다.

GoRoute(
  path: '/a'
  builder: (context, state, child) => APage(
    key: UniqueKey(),
  )
)