flutter 普通路由、普通路由传值

Flutter中的路由介绍

// Flutter中的路由主要涉及页面的跳转操作。
// 使用Navigator组件来管理路由导航,并提供堆栈式的导航方法,如:Navigator.push和Navigator.pop来进行页面的切换。
Flutter 中的路由通俗的讲就是页面跳转。在 Flutter 中通过 Navigator 组件管理路由导航并提供了管理堆栈的方法。如:Navigator.push 和 Navigator.pop

Flutter中基本路由的使用示例

// 下面是一个RaisedButton组件的示例,点击该按钮会跳转到另一个页面,使用MaterialPageRoute进行页面切换,实现淡入淡出效果。
// CupertinoPageRoute则实现从右侧滑入的效果。
RaisedButton(
  child: Text('跳转到分类'),
  onPressed: () {
    Navigator.of(context).push(
      MaterialPageRoute(
        builder: (context) => SearchPage(title: '来了a') // 通过import引入SearchPage页面,并传入title参数
      )
    );
  }
)
MaterialPageRoute // 淡入淡出
CupertinoPageRoute // 右划入

Flutter中的参数传递与接收

// 当我们从一个页面跳转到另一个页面时,经常需要传递一些参数。这可以通过构造函数来实现。
// 例如下面的SearchPage组件,它接收一个title参数,并在页面中显示。
// 为了接收传入的参数,需要在组件的构造函数中声明并使用参数。

class SearchPage extends StatelessWidget{
  String title = ''; // 声明一个字符串变量title来存储传入的参数值
  SearchPage({this.title}); // 通过构造函数接收传入的title参数
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('搜索页面'),
      ),
      body: Text(this.title), // 将传入的title参数显示在页面中
    );
  }
}

posted on 2020-02-20 21:03  完美前端  阅读(360)  评论(0)    收藏  举报

导航