web-dev-qa-db-ja.com

Flutter Web URLナビゲーション

Flutter WebアプリでURLに移動する方法を教えてください。

現在Navigator.of(context).Push(MaterialPageRoute(...));を使用していて、localhost:5354/#/をアドレスバーに入力します。

また、ブラウザのアドレスバーにURLを貼り付けるだけで、特定のURLに直接移動する方法を教えてください。

flutterdartflutter-web
2
Norbert

ルートへのクラスを直接使用する代わりに、名前付きルートを使用する必要があります。 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,
    );
  }
}

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

クエリパラメータを使用してルートを定義することもできます。

お役に立てれば！

3
Shekar Mudaliyar