路由注册到顶层,使每个页面都可以使用,注册到顶层就需要在main.dart中

main.dart注册路由

Flutter实战视频-移动电商-40.路由_Fluro的全局注入和使用方法

注入

onGenerateRoute是MaterialApp自带的路由配置项,

Flutter实战视频-移动电商-40.路由_Fluro的全局注入和使用方法

 

首页跳转到详细页

 

 

 

Flutter实战视频-移动电商-40.路由_Fluro的全局注入和使用方法

 

import '../routers/application.dart';

 

 

_wrapList火爆专区的商品,点击进行跳转

Flutter实战视频-移动电商-40.路由_Fluro的全局注入和使用方法

那么这个/detail是在哪里定义的呢?看下图,是在routers.dart中配置的

Flutter实战视频-移动电商-40.路由_Fluro的全局注入和使用方法

然后再传id过去

Flutter实战视频-移动电商-40.路由_Fluro的全局注入和使用方法

id在路由的这个地方配置的

Flutter实战视频-移动电商-40.路由_Fluro的全局注入和使用方法

 

flutter run 进行测试

Flutter实战视频-移动电商-40.路由_Fluro的全局注入和使用方法

Flutter实战视频-移动电商-40.路由_Fluro的全局注入和使用方法

我们details商品页本身也是比较简单的,就显示了接收的商品的goodsId

Flutter实战视频-移动电商-40.路由_Fluro的全局注入和使用方法

 

最终代码

 

import 'package:flutter/material.dart';
import './pages/index_page.dart';
import 'package:provide/provide.dart';
import './provide/counter.dart';
import './provide/child_category.dart';
import './provide/category_goods_list.dart';
import 'package:fluro/fluro.dart';
import './routers/routers.dart';
import './routers/application.dart';


void main(){
 var counter=Counter();
 var childCategory=ChildCategory();
 var categoryGoodsListProvide=CategoryGoodsListProvide();
 var providers=Providers();
 //final router=Router();//Router就是我们的Fluro
 //注册 依赖
 providers
 ..provide(Provider<Counter>.value(counter))
 ..provide(Provider<CategoryGoodsListProvide>.value(categoryGoodsListProvide))
 ..provide(Provider<ChildCategory>.value(childCategory)); 
  runApp(ProviderNode(child: MyApp(),providers: providers,));
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {

    final router=Router();//Router就是我们的Fluro
    Routes.configurreRoutes(router);//注册router
    Application.router=router;//静态化

    return Container(
      child:MaterialApp(
        title:'百姓生活+',
        onGenerateRoute: Application.router.generator,
        debugShowCheckedModeBanner: false,
        theme: ThemeData(
          primaryColor: Colors.pink
        ),
        home: IndexPage(),
      )
    );
  }
}
main.dart

相关文章:

  • 2021-06-27
  • 2021-08-12
  • 2021-09-02
  • 2021-09-07
  • 2021-12-15
  • 2022-01-08
  • 2021-12-02
  • 2021-12-24
猜你喜欢
  • 2022-12-23
  • 2021-09-03
  • 2021-05-21
  • 2021-05-30
  • 2022-01-21
  • 2021-07-21
相关资源
相似解决方案