it营大地专栏

Flutter中的路由 普通路由、普通路由传值

发布于 8 个月前 作者 phonegap100 152 次浏览 来自 分享

Flutter中的路由通俗的讲就是页面跳转。在Flutter中通过Navigator组件管理路由导航。 并提供了管理堆栈的方法。如:Navigator.push和Navigator.pop

Flutter中给我们提供了两种配置路由跳转的方式:1、基本路由 2、命名路由

一、Flutter 中的基本路由使用

比如我们现在想从HomePage组件跳转到SearchPage组件。

1、需要在HomPage中引入SearchPage.dart

import '../SearchPage.dart';

2、在HomePage中通过下面方法跳转

RaisedButton(
            child: Text("跳转到搜索页面"),
            onPressed: (){
              Navigator.of(context).push(
                MaterialPageRoute(
                  builder: (BuildContext context){
                      return SearchPage();
                  }
                )
              );
                
            },
            color: Theme.of(context).accentColor,
            textTheme: ButtonTextTheme.primary
)

二、Flutter 中的基本路由跳转传值

比如我们现在想从HomePage组件跳转到SearchPage组件传值。 1、需要在HomPage中引入SearchPage.dart

import '../SearchPage.dart';

2、在HomePage中通过下面方法跳转


RaisedButton(
            child: Text("跳转到搜索页面"),
            onPressed: (){
              Navigator.of(context).push(
                MaterialPageRoute(
                  builder: (BuildContext context){
                      return SearchPage(title:"表单");  //传值
                  }
                )
              );
                
            },
            color: Theme.of(context).accentColor,
            textTheme: ButtonTextTheme.primary
)

回到顶部