【Flutter】Flutter学习-GetX 导航操作

1.跳转

在原生中咱们一般运用的是push进行跳转的,这儿是没有界说途径直接经过上下文进行跳转

复制代码
Navigator.of(context).push(MaterialPageRoute(
    builder: (BuildContext context) => DiscoverChildPage(
          title: widget.title,
        )));

咱们运用Get.to进行跳转

复制代码
 Get.to( DiscoverChildPage(
          title: widget.title,
        )),

当咱们界说途径则直接经过Get.toNamed

复制代码
Get.toNamed("/discover/child");

或许咱们之前界说的AppRoutes并运用GetX 界说了路由则直接

复制代码
Get.toNamed(AppRoutes.discoverDetail);

2. 回来

在原生中咱们一般运用的是pop进行回来的

复制代码
Navigator.pop(context)

运用Getx的话

复制代码
Get.back()

3. 铲除

咱们有些时分会用到一些铲除的作用,比方说咱们初次注册的时分,流程完成后就应该铲除该页面

铲除上一个页面

复制代码
class ChartChildPage extends StatelessWidget {
  const ChartChildPage({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('子页面'),),
      body: IconButton(
        icon:const Icon(Icons.close),
        onPressed: ()=> Get.offNamed(AppRoutes.network)
      ),
    );
  }
}

或许直接经过页面

复制代码
Get.off(const ChatListPage())

铲除所有途径

复制代码
onPressed: ()=> Get.offAll(const ScaffoldPage())

也可经过途径

复制代码
onPressed: ()=> Get.offAllNamed(AppRoutes.network)

Get.offAll这儿会铲除之前的途径并回来咱们括号中的页面并进行初始化,而Get.off则仅仅相当于回来咱们想要的页面,其中的页面便是相当于咱们想要的途径,这样咱们就能够回来指定页面了,比方可返还当前页面的上上个页面

4. 传值

在页面之间传值与回来值的接收都是开发中必要的功用,比较属性传值,经过Getx传值更加便利。

传值

咱们在页面跳转的的时分增加

复制代码
Future<T?>? toNamed<T>(
  String page, {
  dynamic arguments,
  int? id,
  bool preventDuplicates = true,
  Map<String, String>? parameters,
})

咱们一般界说的是arguments,由于是dynamic因此能够动态的界说类型

复制代码
Get.toNamed(AppRoutes.webview,arguments: '我是一个标题');

而parameters则一般是一个 Map<String, String>类型

复制代码
Get.toNamed(AppRoutes.loadImage,arguments: items[index],parameters: {'title':'跳转网页','desc': "跳转网页",},

取值

这儿咱们arguments传的是什么便是取的是什么

复制代码
String? title = Get.arguments['title'];

获取parameters

复制代码
final parameters = Get.parameters;
String? title1 = parameters['title'];

5. 回来值

一般咱们能够在Get.back增加result

复制代码
void back<T>({
  T? result,
  bool closeOverlays = false,
  bool canPop = true,
  int? id,
})

这儿咱们result为咱们回传的参赛,closeOverlays则是否封闭当前的弹出框

复制代码
Get.back(result: {'result':'success'});

承受

复制代码
var data = await Get.to(const ChartChildPage());
print(data);

打印结果

复制代码
flutter: {result: success}

6. 拼接参数

咱们有的时分会途径拼接或许运用url拼接参数

复制代码
static void goWeb(String url, String title) {
  Get.toNamed(
      "/web?url=${Uri.encodeComponent(url)}&title=${Uri.encodeComponent(title)}");
}

这样咱们经过参数传递进入web页

复制代码
XRouter.goWeb(url, title);

在WebViewPage获取

复制代码
String? url = Get.parameters['url'];
String? title = Get.parameters['title'];

7.小结

能够发现经过Getx进行页面的跳转以及回来,或许指定相应页面回来都是比较便利的,同时传参也是多种形式,回来的时分也能够携带参数以及状况从而处理咱们页面,刷新状况等。

相关推荐
奶黄小甜包31 分钟前
C语言零基础第18讲:自定义类型—结构体
c语言·数据结构·笔记·学习
rannn_1113 小时前
【MySQL学习|黑马笔记|Day7】触发器和锁(全局锁、表级锁、行级锁、)
笔记·后端·学习·mysql
i紸定i3 小时前
解决html-to-image在 ios 上dom里面的图片不显示出来
前端·ios·vue·html·html-to-image
喜欢吃燃面3 小时前
C++算法竞赛:位运算
开发语言·c++·学习·算法
传奇开心果编程4 小时前
【传奇开心果系列】Flet框架实现的家庭记账本示例自定义模板
python·学习·ui·前端框架·自动化
_Kayo_10 小时前
node.js 学习笔记3 HTTP
笔记·学习
fouryears_2341710 小时前
Flutter InheritedWidget 详解:从生命周期到数据流动的完整解析
开发语言·flutter·客户端·dart
CCCC131016313 小时前
嵌入式学习(day 28)线程
jvm·学习
星星火柴93613 小时前
关于“双指针法“的总结
数据结构·c++·笔记·学习·算法
小狗爱吃黄桃罐头13 小时前
正点原子【第四期】Linux之驱动开发篇学习笔记-1.1 Linux驱动开发与裸机开发的区别
linux·驱动开发·学习