[Flutter] GoRouter + GetxController

• GoRouter와 GetX를 사용할 때 GetPage를 사용하지 못하다보니 원래 사용해오던 Getx의 바인딩을 사용하지 못하는 문제가 발생했다.

• 해결방법 : GetBuilder를 통해 바인딩을 직접 지정해줘야한다.

void main() => runApp(MyApp());

final GoRouter router = GoRouter(
  initialLocation: '/some/path',
  routes: [
    /* some path */
    GoRoute(
      path: '/some/path',
      builder: (context, state) => GetBuilder(
        init: SomeController(),
        dispose: (state) {
          Get.delete<SomeController>();
        },
        builder: (controller) => SomePage(),
      ),
    ),
  ],
);

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return GetMaterialApp.router(
      routeInformationParser: router.routeInformationParser,
      routeInformationProvider: router.routeInformationProvider,
      routerDelegate: router.routerDelegate,
      backButtonDispatcher: router.backButtonDispatcher,
    );
  }
}

class SomePage extends GetView<SomeController> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Obx(() => Text(controller.hello.value)),
      ),
    );
  }
}

class SomeController extends GetxController {
  final RxString hello = 'Hello Hello'.obs;

  @override
  void onReady() {
    Future.delayed(const Duration(seconds: 2)).then((_) {
      hello.value = 'Bye Bye';
    });
  }
}

• 이런 방식으로 호출하면 된다. builder가 두 번 사용되는 형태가 바람직해 보이지는 않지만 Getx에서 제공되는 라우팅을 사용하지 않고 GoRouter와 섞어 사용하기 위해선 어쩔 수 없어 보인다.

• dispose에 Get.delete를 선언하면 페이지에서 빠져 나올 때 컨트롤러를 메모리에서 제거한다.