Une solution de gestion de routage légère et pratique pour le flutter

nav_router est la solution de gestion de routage la plus simple / légère / pratique pour le flutter. Il prend en charge diverses animations de routage et il est très pratique de sauter / passer des paramètres. Pour passer à une nouvelle page, il suffit de routePush (NewPage ());

• 2020.07.04-Test Flutter 1.17.3

• 2020.06.03-Annuler les données de chaîne vide par défaut pop

• 2020.02.28 – Correction de la méthode pop de l’erreur de flottement de la branche de développement.

Commencer

Ajouter une dépendance

dependencies:
  nav_router: any #Specific version customization (any means latest)

Articles connexes mis à jour…

Utilisez ensuite flutter packages upgrade pour mettre à jour les packages de plug-ins Flutter

Il y a un joli exemple de projet dans le dossier example. Vérifiez-le. Sinon, continuez à lire pour être opérationnel.

• 1.Importez notre plugin sur la page de MaterialApp

import 'package:nav_router/nav_router.dart';

• 2.Écrire navGK valeur dans navigatorKey propriété de MaterialApp

  Widget build(BuildContext context) {
    return new MaterialApp(
      title: '',
      navigatorKey: navGK,
    );
  }

• 3.Ensuite, nous pouvons commencer à l’utiliser, voici un exemple de page de saut

Widget buildItem(RouteModel item) {
  return new FlatButton(
    onPressed: () => routePush(new NewPage()),
    child: new Text('Click to jump'),
  );
}

• 4. Si nous voulons utiliser d’autres animations de routage pour sauter, nous pouvons ajouter des propriétés de saut plus tard, telles que : animation de dégradé

routePush(new NewPage(), RouterType.fade);

Voie 1：

Normalement, poussez la nouvelle page, mais ajoutez Ensuite, à l’arrière, le v derrière est la donnée ramenée par la page après le saut, puis nous l’imprimons.

routePush(NewPage()).then((v) {
  print('I received::$v');
});

Ensuite, notre nouvelle page affichera la valeur de retour. Ajoutez nos paramètres directement dans la pop puis les parenthèses. Il peut s’agir de n’importe quel type de valeur de paramètre. Après cela, ce que nous avons écrit ci-dessus recevra les paramètres que nous avons retournés cette fois avec le passé.

FlatButton(
  onPressed: () {
    pop('This is the parameter');
  },
  child: Text('Return with parameters'),
),

Voie 2：

La deuxième méthode peut utiliser notre NavData, ajoutez d’abord le paramètre de type NavData à la page vers laquelle nous voulons pousser,

class NewPage extends StatlessWidget {
  final NavData navData;

  NewPage({this.navData});
}

Ensuite, ce qui suit juge si le navData est vide, c’est-à-dire si le supérieur a reçu cette méthode, et si c’est le cas, la renvoie avec des paramètres.

FlatButton(
  onPressed: () {
    if(navData == null) return;
    widget.navData('NavData mode parameter transmission');
    pop();
  },
  child: Text('Return with parameters'),
),

Ensuite, l’endroit où nous poussons peut utiliser navData pour recevoir la valeur et l’imprimer.

routePush(NewPage(navData: (v) {
    print('I received::$v');
  }),
);

Ci-dessus ne peut pas montrer mon point

Flutter J：www.flutterj.com

LICENCE

fluttercandies/nav_router is licensed under the
Apache License 2.0

A permissive license whose main conditions require preservation of copyright and license notices. 
Contributors provide an express grant of patent rights. 
Licensed works, modifications, and larger works may be distributed under different terms and without source code.

GitHub

Voir Github