GetX에서의 페이지 이동을 Navigator와 비교하여 확인해보겠습니다.

일반적인 라우트 방식

단순 페이지 이동

Navigator

Navigator.of(context).push(MaterialPageRoute(
	builder:(_) => FirstPage(),
));

GetX

Get.to(FirstPage());

뒤로 가기

Navigator

Navigator.of(context).pop();

• 네비게이터의 context 접근
  => stateless 위젯에서 빌드를 벗어난 곳에서 뒤로가기를 위해서 또 다시 context를 전송해주어야 하는 번거로움 존재함

GetX

Get.back();

이전 스택 제거 후 홈으로 이동

Navigator

Navigator.of(context).pushAndRemoveUntil(MaterialPageRoute(
	builder:(_) => Home())),
    (route) => false);

GetX

Get.offAll(Home());

Named 라우트 방식

main.dart 파일 비교

기존 main.dart와 Navigator

//main.dart
initalRoue: "/",
routes:{
	"/": (context) => Home(),
    "/first": (context) => FirstNamedPage(),
    "/second": (context) => SecondNamedPage()
}

GetX main.dart

//main.dart =>  routes대신 getPages 이용
GetMaterialApp(
  getPages:[
      GetPage(name:"/", page : () => Home(),transition: Transition.fadeIn),
      GetPage(name:"/first", page : () => FirstNamedPage()),
      GetPage(name:"/second", page : () => SecondNamedPage()),
      ]  
	); 

• 다양한 trainsition 설정이 가능하다 !

단순 페이지 이동

Navigator

Navigator.of(context).pushNamed("/first");

GetX

Get.toNamed("/first");

뒤로 가기

위와 동일!

이전 스택 제거 후 홈으로 이동

Navigator

Navigator.of(context).pushNamedAndRemoveUntil("/first");

GetX

Get.offNamed("/first");

Arguments 전달 방법

string , int형 전달하기

Get.to(FirstPage(),
	arguments: {'name' :'example', 'age': 20});
    
    //FirstPage 이동 후 전달 받은 arguments 사용하기
Text("이름은 ${Get.arguments['name']}")
Text("나이는 ${Get.arguments['age']}")

그 외 객체 전달하기

class User{
	String name;
	int age;
    User({this.name,this.age})
}

~
~

Get.to(FirstPage(),
	arguments: User(name:"myname",age:10));
    
    //FirstPage 이동 후 전달 받은 arguments 사용하기
Text("이름은 ${(Get.arguments as User).name}")
Text("나이는 ${(Get.arguments as User).age}")

동적 url 적용

//main.dart의 getPages
GetPage(
	name:"/user/:uid"
    page: () => UserPage()
)
~
~

Get.toNamed("/user/23421?name=mia&age=10");
    
//UserPage에서 parameter 사용하기
Text("${(Get.parameter['uid']}")
Text("${(Get.parameter['name']}님 안녕하세요")
Text("${(Get.parameter['age']}세 입니다")

=> 출력 결과
	23421
	mia님 안녕하세요
	10세 입니다

출처 https://youtu.be/OXfG-D4PNpQ