Flutter 라우팅 패키지 - go_router

go_router?

Flutter 공식 유튜브의 Package of the Week에서, Flutter 라우팅 패키지인 go_router가 소개되었다.

Flutter 공식 유튜브의 Package of the Week에서, Flutter 라우팅 패키지인 go_router가 소개되었다.

go_router는 URL 기반의 API를 사용하여 화면들을 편리하게 탐색할 수 있는 선언적 라우팅 패키지이며,
URL을 사용하여 네비게이션과 딥링크와 같은 네비게이션 관련 처리를 할 수 있다고 소개하고 있다.
제공하고 있는 기능으로는 다음과 같다.

• "user/:id" 와 같은 구문으로 경로와 쿼리 매개변수 분석
• 목적 경로에 대해 여러 화면 표시
• Redirection을 지원한다. 앱의 상태에 따라 사용자를 다른 URL로 다시 라우팅할 수 있다. 예를 들어, 특정 화면 접근 시 로그인 되지 않은 경우 로그인 화면으로 이동과 같은 것이 될 수 있겠다.
• ShellRoute를 통한 다수의 Navigator를 지원한다. 일치하는 경로를 기반으로 자체 페이지를 표시하는 내부 Navigator를 사용할 수 있다. BottomNavigationBar가 계속 보여져야 하는 경우 등이 있을 수 있다.
• Google의 Material, iOS의 Cupertino를 지원한다.
• Navigator API와 하위 호환성을 제공한다.

네비게이션 처리로써는 부족함이 없는 기능이라고 판단된다.
개인적으로는 Android의 Navigation Component와 비슷하다는 느낌을 받을 수 있었다.

---

Code Snippet

final GoRouter _router = GoRouter(
  routes: [
    GoRoute(
      path: '/',
      builder: (context, state) => HomeScreen()
    ),
    GoRoute(
      path: '/notification',
      builder: (context, state) => NotificationScreen()
    ),
    GoRoute(
      path: '/profile/:userId?filter=xyz',
      builder: (context, state) => ProfileScreen(
        userId: state.params['userId'],
        filter: state.queryParams['filter']
      )
    ),
  ]
);

기본적인 사용법은 굉장히 간단하다.
GoRouter를 초기화하고, 내부에 routes 배열을 지정해주면 된다.

routes 배열은 GoRoute 객체의 배열이다.
GoRoute 객체는 화면에 사용할 URL 경로와 그 URL에 해당하는 Widget을 그려낼 builder를 정의해준다.
또한 URL의 Path Parameter, Query Parameter는 builder의 state에서 획득할 수 있다.

Flutter 개발 시 화면 이동 처리는 go_router를 활용하면 굉장히 편리할 것 같다.
더욱 자세한 정보는 pub.dev의 공식문서에서 확인할 수 있다.

https://pub.dev/packages/go_router