Flutter 网址导航

Nor*_*ert 10 dart flutter flutter-web

我想知道如何导航到 Flutter Web 应用程序中的 URL。

目前正在使用Navigator.of(context).push(MaterialPageRoute(...));,我只能进入localhost:5354/#/地址栏。

另外,我想知道如何通过将 URL 粘贴到浏览器的地址栏中直接导航到特定的 URL。

小智 13

您需要使用命名路由,而不是直接使用类来路由。你可以使用这个名为 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,
    );
  }
}

Run Code Online (Sandbox Code Playgroud)

路线.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,
    );
  }
}

Run Code Online (Sandbox Code Playgroud)

您还可以使用查询参数定义路由。

希望这可以帮助!