Flutter 路由小谈

2020-11-17 Flutter

直接跳转
初始化执行路线
pushAndRemoveUntil
pushReplancementNamed
popUntil
popAndPushNamed

直接跳转

import 'newpage.dart';

Navigator.of(context).push(
    MaterialPageRoute(builder: (context)=>NewPage())
);

如果跳转的页面需要参数，可以直接传入。

初始化执行路线

定义路由集合

final routes = {
  '/': (context) => Loading(),
  '/home': (context) => Home(),
  '/settings': (context) => Settings(),
  '/update': (context) => UpdatePage(),
};

使用路由

void main() {
 runApp(MarsApp());
}

class MarsApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
	return MaterialApp(
	  initialRoute: '/',
	  routes: routes,
	);
  }
}

页面跳转

1	Navigator.pushNamed(context, '/stats');

`pushAndRemoveUntil`

这个方式是跳转到某个页面，然后移除路由直到...为止

// 普通使用
Navigator.of(context).pushAndRemoveUntil(
    MaterialPageRoute(builder: (context) => MyPage()), (route) => route == null);

// 路由方式
Navigator.pushNamedAndRemoveUntil(context, '/', (route) => route == null);

上面的两种使用方式都可以达到禁止返回上一级的作用，应为这里给出的是 route == null, 所以会将路由栈里的元素全部移除。

1	Navigator.of(context).pushNamedAndRemoveUntil('/setting',ModalRoute.withName('/'));

上面的方式可以在跳转到setting页面后，若返回则直接到/页面。

`pushReplancementNamed`

使用该方法跳转页面，会在路由栈中用新页面替换老页面。这时完成跳转后返回则好似返回上上个页面。

1	Navigator.of(context).pushReplacementNamed('/page');

`popUntil`

1	Navigator.popUntil(context,ModalRoute.withName('/'));

与 pushAndRemoveUntil 配套，退回到某个指定页面。

`popAndPushNamed`

与pushReplacementNamed方法类似，其执行结果栈是的路由栈与pushReplacementNamed方法的效果是一致的。