关于flutter:flutter配置fluro

1、编写路由配置文件

①创立routes.dart文件 并编写Routes类的根本构造    
②定义路由名称    
③定义路由处理函数
④编写函数configureRoutes关联路由名称和处理函数  

2、在Application中配置路由

①定义router  
②通过调用configureRoutes配置router  
③在MaterialApp中应用router 

routes.dart

import 'package:fluro/fluro.dart';
import 'package:flutter/material.dart';
import './pages/home/index.dart';
import './pages/login.dart';

class Routes {
  //1、定义路由名称
  static String home = '/';
  static String login = '/login';
  //2、定义路由处理函数
  static Handler _homeHandler = Handler(handlerFunc: (BuildContext context, Map<String, dynamic> params) {
    return HomePage();
  });
  static Handler _loginHandler = Handler(handlerFunc: (BuildContext context, Map<String, dynamic> params) {
    return LoginPage();
  });
  //3、编写函数configureRoutes关联路由名称和处理函数
  static void configureRoutes(FluroRouter router) {
    router.define(home, handler: _homeHandler);
    router.define(login, handler: _loginHandler);
  }

}

application.dart

import 'package:fluro/fluro.dart';
import 'package:flutter/material.dart';
import './routes.dart';

class Application extends StatelessWidget {
  const Application({ Key key }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final router = FluroRouter();
    Routes.configureRoutes(router);
    return MaterialApp(
      onGenerateRoute: router.generator,
    );
  }
}

效果图如下:

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理