flutter - 使用 Fluro 进行导航(Flutter web)
问题描述
我正在尝试导航到页面。试图创建一些路线。
我遇到的问题是:
- 当路由更改时,它会从 URL 中消失
- 当我尝试在浏览器中后退或前进时,它什么也不做。
我正在尝试使用Fluro 包。我也在尝试将他们的示例与我的示例进行比较,但我没有发现有什么区别。主要飞镖:
void main() {
runApp(AppComponent());
}
class AppComponent extends StatefulWidget {
@override
State createState() {
return _AppComponentState();
}
}
class _AppComponentState extends State<AppComponent> {
_AppComponentState() {
final router = FluroRouter();
Routes.configureRoutes(router);
Application.router = router;
}
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'NexTeam',
debugShowCheckedModeBanner: false,
initialRoute: kHomeRoute,
onGenerateRoute: Application.router.generator,
);
}
}
class Application {
static FluroRouter router;
}
路由器.dart:
class Routes {
final router = FluroRouter();
static Handler _loginHandler = Handler(handlerFunc: (BuildContext context, Map<String, dynamic> params) => LoginPage());
static Handler _registerHandler = Handler(handlerFunc: (BuildContext context, Map<String, dynamic> params) => RegisterPage());
static Handler _homeHandler = Handler(handlerFunc: (BuildContext context, Map<String, dynamic> params) => HomePage());
static Handler _profileHandler = Handler(handlerFunc: (BuildContext context, Map<String, dynamic> params) => ProfilePage());
static Handler _notificationsHandler = Handler(handlerFunc: (BuildContext context, Map<String, dynamic> params) => NotificationsPage());
static Handler _chatHandler = Handler(handlerFunc: (BuildContext context, Map<String, dynamic> params) => ChatPage());
static void configureRoutes(FluroRouter router) {
router.define(kLoginRoute, handler: _loginHandler);
router.define(kRegisterRoute, handler: _registerHandler);
router.define(kHomeRoute, handler: _homeHandler);
router.define(kProfileRoute, handler: _profileHandler);
router.define(kNotificationsRoute, handler: _notificationsHandler);
router.define(kChatRoute, handler: _chatHandler);
}
}
导航功能:
Application.router.navigateTo(context, kNotificationsRoute);
解决方案
我仍然不知道为什么,但问题是我所有的页面都以 开头MaterialApp
,而解决方案是使用Material
.
推荐阅读
- python - python中其他目录中的类中的I/O
- sql - 根据条件获取最新行
- c# - Task.Run 中的 Task.delay
- ruby-on-rails-4 - 如何在 Rails 4 上使用 RuboCop::Cop::Rails::ApplicationRecord
- nuxt.js - Nuxt.js google AdSense 返回错误 支持一个标签
- node.js - 如何在 AWS Elasticache 中测试 redis 的性能?
- reactjs - 如何使用反应修复错误“无法在回调函数中调用反应使用钩子”?
- azure-devops - Azure DevOps 查询 Epic 中的所有 PBI
- python - Python中最大化窗口的分辨率
- android - 在 Android 中使用 .cer(公钥)验证/验证的 XML 签名