[Flutter] 페이지 나누기 - 라우터 사용 (/)

라우터 사용 (/)

• 페이지가 많은 경우 사용
• 라우터를 제대로 쓸 거면 패키지 설치해서 사용 → 깔끔한 문법으로 페이지 나누기 가능
  
  

웹 페이지처럼 페이지 단위로 나눌 수 있음

MaterialApp(
    initialRoute: '/',
    routes: {
      '/': (context) => Text('첫페이지'),
      '/detail': (context) => Text('둘째페이지'),
    },
);

 

Navigator.pushNamed(context, '/detail');

• 버튼을 눌렀을 때 페이지 이동하게 만들고 싶은 경우 사용
  
  
  

라우터에 파라미터를 입력하고 싶은 경우

MaterialApp(
      initialRoute: '/',
      onGenerateRoute: (settings) {
        var arguments = settings.arguments;
        if (settings.name == '/detail') {
          return MaterialPageRoute(builder: (context) => Upload(routeparam : arguments) );
        } else if (settings.name == '/') {
          return MaterialPageRoute(builder: (context) => Text('홈페이지') );
        } else {
          return null;
        }
      },
);

• /detail/1 로 이동하면 routeparam이라는 파라미터가 1로 변하고
• /detail/2 로 이동하면 routeparam이라는 파라미터가 2로 변합니다.
• 그리고 routeparam의 값은 Upload() 위젯 안에서 등록하고 사용 가능