Flutter一个轻量且强大的插件:GetX 之路由管理
共 2352字,需浏览 5分钟
·
2021-04-01 15:38
GetX 是 Flutter 上的一个轻量且强大的解决方案:高性能的状态管理、智能的依赖注入和便捷的路由管理。
GetX官方以低功能、高性能、低耦合为基本原则,以轻量级的方式,给开发者提供众多功能。
GetX所能提供的功能包括:状态管理、路由管理、依赖管理,提供如国际化、主题等等更多实用工具,今天我们来看下GetX 之路由管理是怎么样的。
以往在使用路由管理时,都绕不开上下文(context),如
Navigator.pushNamed(context, '/login', arguments: arguments);
或
Navigator.pop(context)
都需要一个context上下文,即使封装也都需要从widget builder传入context。接下来我们看看getX路由是多么方便。
GetX依赖
使用getX,首先要引入依赖库,pubspec.yaml加入该库,并拉取依赖到本地。
get: ^3.25.0
然后在用到的地方引入头文件
import 'package:get/get.dart';
GetX路由管理
普通路由导航
在你的MaterialApp前加上 "Get",把它变成GetMaterialApp。
void main() {
runApp(
GetMaterialApp(
home: HomePage(),
),
);
}
导航到新页面
Get.to(LoginPage());
pop 返回、关闭snackbars, dialogs, bottomsheets
Get.back();
push到下一页,但禁止从下一页返回过来
Get.off(LoginPage());
可以用在启动屏、登录页中。
push到下一页,并且从栈内移除以前的所有路由
Get.offAll(LoginPage());
可以发现,上面的push和pop方式,不需要传递context,省下了很多麻烦,这个GetX在路由管理的最大优势,这样增加了路由管理的书写范围,扩大了你代码灵活性,不用担心context在哪,而特意使用builder。
当然,这里路由管理也可以使用别名导航。
别名路由导航
如果你习惯使用别名路由导航,GetX也支持
要使用别名路由导航,需要定义路由,在main函数内使用GetMaterialApp,并设置相关属性。
void main() {
// 别名路由配置
runApp(
GetMaterialApp(
initialRoute: '/',
getPages: [
GetPage(name: '/', page: () => OnePage()),
GetPage(
name: '/two', page: () => TwoPage(), transition: Transition.zoom),
],
),
);
}
GetMaterialApp下还有一个属性unknownRoute,可以设置未定义路由的导航,如错误页面。
unknownRoute: GetPage(name: '/notfound', page: () => UnknownRoutePage()),
push到下一页
Get.toNamed("/two");
push下一页并移除前一个页面。
Get.offNamed("/two");
push下一页并移除所有之前的页面
Get.offAllNamed("/two");
push时携带数据 主要在后面加上你要传递的数据即可
Get.toNamed("/two", arguments: 'www.qson.tech');
在你别名为two的页面通过Get.arguments
即可获取数据。
下一篇带大家了解GetX的响应式状态管理器,更多关于GetX的内容,后续会继续发出,你也可以访问GetX的github地址:https://github.com/jonataslaw/getx