Getting Started


VxNavigator is based on navigator 2.0 for app and web. It provides many useful methods and send params easily.

Getting started

Import routing management in the main.dart file and configure routing

void main() {
class MyApp extends StatefulWidget {
State<StatefulWidget> createState() => _MyAppState();
class _MyAppState extends State<MyApp> {
final _routerDelegate = VxNavigator(
pageNotFound: (uri, params) => MaterialPage(
key: ValueKey('not-found-page'),
child: Builder(
builder: (context) => Scaffold(
body: Center(
child: Text('Page ${uri.path} not found'),
routes: {
'/': (uri, params) => HomePage(),
'/test/todo': (uri, params) =>
'/result': (uri, params) => ResultPage(),
'/login': (uri, params) => LoginPage(),
Widget build(BuildContext context) {
return MaterialApp.router(
title: 'VxNavigator',
routerDelegate: _routerDelegate,
routeInformationParser: VxInformationParser(),

The routes field:

key is url

Value is the function to return to the page, uri is the route parameter, and params is the page parameter, which is passed according to the parameter type.



VxNavigator.of(context) can be used as context.vxNav or vice-versa.

1.push(Uri uri, {dynamic params})

Route jump method, support routing parameter transfer and custom data type transfer parameter

context.vxNav.push(Uri(path: '/test/todo', queryParameters: {'limit': '12'}));
context.vxNav.push(Uri(path: '/test/todo'), params: your model);

2.replace(Uri uri, {dynamic params})

Replace the current route.

context.vxNav.replace(Uri(path: '/test/todo'));


Return to the previous page, if you want to return the reference, please use returnAndPush


4.clearAndPush(Uri uri, {dynamic params})

Clear the routing stack and reset the home page, such as a login scenario

context.vxNav.clearAndPush(Uri(path: '/login'));

5.pushAll(List<Uri> uris, {List<dynamic> params})

Set multiple uris at once and jump to the last route

context.vxNav.pushAll([Uri(path: '/test/todo', queryParameters: {'limit': '12'}), Uri(path: '/test/todo')]);

6.clearAndPushAll(List<Uri> uris, {List<dynamic> params})

Clear the routing stack and jump (set multiple uri)

context.vxNav.clearAndPushAll(Uri(path: '/test/todo', queryParameters: {'limit': '12'}));

7.waitAndPush(Uri uri, {dynamic params})

Jump to wait for the result

context.vxNav.waitAndPush(Uri(path: '/test/todo', queryParameters: {'limit': '12'}));

8.returnAndPush(dynamic value)

Jump to return result

context.vxNav.returnAndPush(your value);


The routing stack only keeps the home page


10.removeUri(Uri uri)

Delete the specified route

context.vxNav.removeUri(Uri(path: '/test/todo'));


Delete the route at the top of the stack