Flutter web url 导航
Flutter web url navigation
我想知道如何在我的 Flutter 网络应用程序中导航到 URL。
目前正在使用 Navigator.of(context).push(MaterialPageRoute(...));
,我在地址栏中只看到 localhost:5354/#/
。
我还想知道如何通过将 URL 粘贴到浏览器的地址栏中直接导航到特定的 URL。
您需要使用命名路由,而不是直接使用 类 路由。
您可以使用这个名为 fluro https://pub.dev/packages/fluro 的包
或者你可以使用 flutter 提供的默认导航。
使用 fluro 你可以做这样的事情
main.dart
import '../routes/routes.dart';
void main() {
FluroRouter.setupRouter();
// run app
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
initialRoute: '/',
onGenerateRoute: FluroRouter.router.generator,
);
}
}
routes.dart
import 'package:fluro/fluro.dart';
import 'package:flutter/material.dart';
class FluroRouter {
static Router router = Router();
static Handler _storyhandler = Handler(
handlerFunc: (BuildContext context, Map<String, dynamic> params) =>
HomeView(id: params['id'][0]));
static Handler _homehandler = Handler(
handlerFunc: (BuildContext context, Map<String, dynamic> params) =>
Home());
static void setupRouter() {
router.define(
'/',
handler: _homehandler,
);
router.define(
'/story/:id',
handler: _storyhandler,
);
}
}
您还可以使用查询参数定义路由。
希望对您有所帮助!
您必须使用 Navigator v2 for Web。
我想知道如何在我的 Flutter 网络应用程序中导航到 URL。
目前正在使用 Navigator.of(context).push(MaterialPageRoute(...));
,我在地址栏中只看到 localhost:5354/#/
。
我还想知道如何通过将 URL 粘贴到浏览器的地址栏中直接导航到特定的 URL。
您需要使用命名路由,而不是直接使用 类 路由。 您可以使用这个名为 fluro https://pub.dev/packages/fluro 的包 或者你可以使用 flutter 提供的默认导航。
使用 fluro 你可以做这样的事情
main.dart
import '../routes/routes.dart';
void main() {
FluroRouter.setupRouter();
// run app
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
initialRoute: '/',
onGenerateRoute: FluroRouter.router.generator,
);
}
}
routes.dart
import 'package:fluro/fluro.dart';
import 'package:flutter/material.dart';
class FluroRouter {
static Router router = Router();
static Handler _storyhandler = Handler(
handlerFunc: (BuildContext context, Map<String, dynamic> params) =>
HomeView(id: params['id'][0]));
static Handler _homehandler = Handler(
handlerFunc: (BuildContext context, Map<String, dynamic> params) =>
Home());
static void setupRouter() {
router.define(
'/',
handler: _homehandler,
);
router.define(
'/story/:id',
handler: _storyhandler,
);
}
}
您还可以使用查询参数定义路由。
希望对您有所帮助!
您必须使用 Navigator v2 for Web。