不知到大家在软件开发过程中,在写页面跳转过程中,反复写重复跳转的代码,那么能不能用key value的形式 /search--键, SearchPage--值对的方式来简化跳转页面实现。
那么话不多说,我们开始来详细描述Tabs组件实现过程:
1 创建1个Routers文件夹,并创建router.dart文件
routers文件夹
2 将封装好的代码copy到router.dart文件里面
3 配置tabs跳转的key和value
配置path
4 MyApp的组件里面添加onGenerateRoute属性并赋值router里面onGenerateRoute,并且initialRoute--/确定根控制器Tabs
红色框路由配置
5 测试编译没有错误的情况下,开始进行在主页添加1个按钮进行测试跳转其他页面功能尝试
创建Search.dart文件,创建搜索页并添加AppBar和body的UI组件
创建搜索页面
在router.dart配置搜索页面 1个router的path来实现页面跳转路径
search的path
在Home主页创建一个按钮,添加跳转时间测试路由
测试首页按钮跳转搜索页面是否成功
主页按钮跳转
跳转搜索页面