颤音:从其他文件提供映射到路由选项

Question

我在这里有些不幸。

    return MaterialApp(
      title: 'App Title',
      theme: ThemeData(brightness: Brightness.dark),
      initialRoute: '/',
      routes: SOMETHING_HERE,
    );

我想从另一个文件中推出一些东西，但是我似乎无法在此处推出一个正确的值。

其他文件(尝试(：

import '../screens/home.dart';
import '../screens/charts.dart';
class Routes {
  factory Routes(context) {
    Map<String, Widget Function(BuildContext)> _routes;
    _routes = {
      '/': (context) => ScreenHome(),
      '/charts': (context) => ScreenCharts(),
    };
    return _routes;
  }
}

这不起作用，因为它说： The argument type 'Routes' can't be assigned to the parameter type 'Map<String, (BuildContext) → Widget>'

当然，我可以将地图传递给此参数，但我想在单独的文件中定义路线。

关于如何完成此操作的任何建议？

Answer 1

我只是遇到了相同的问题并找到了解决方案。

您不需要创建类，只需创建一个等于路由Map

的var

main.dart：

import 'package:flutter/material.dart';
import './custom_routes.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        theme: ThemeData(brightness: Brightness.dark),
        initialRoute: '/',
        routes: customRoutes,
    );
  }
}

custom_routes.dart：

import 'package:flutter/material.dart';
import '../screens/home.dart';
import '../screens/charts.dart';
var customRoutes = <String, WidgetBuilder>{
  '/': (context) => ScreenHome(),
  '/charts': (context) => ScreenCharts(),
};

Answer 2

只需通过Map<String, WidgetBuilder>的返回创建任何功能，在这里我将显示如何将数据传递给您的路由类：

1-创建新文件routes.dart，此完整代码(我使用我的自定义变量，例如serverToken，notifierThemeMode(来充分说明该过程：

import 'package:rxdart/rxdart.dart';
import 'package:flutter/material.dart';
import 'package:path/to/home_screen.dart';
import 'package:path/to/login_screen.dart';
class AppRoutes{
  // get initial route
  static getInitialRoute({String? serverToken}){
    return serverToken == null
        ? LoginScreen.routeName
        : HomeScreen.routeName;
  }
  // get all app routes
  static Map<String, WidgetBuilder> getRoutes({
    required BehaviorSubject<ThemeMode?> notifierThemeMode,
    required BehaviorSubject<Locale?> notifierLocale,
  }){
    return {
      HomeScreen.routeName: (BuildContext context) => HomeScreen(
        notifierThemeMode: notifierThemeMode,
      ),
      LoginScreen.routeName: (BuildContext context) => LoginScreen(
        notifierLocale: notifierLocale,
      ),
  }
}

2-在 MaterialApp widget in the先前的函数：

MaterialApp(
   ...
   routes: AppRoutes.getRoutes(
            notifierThemeMode: _notifierThemeMode,
            notifierLocale: _notifierLocale
           ),
   initialRoute: AppRoutes.getInitialRoute(
            serverToken: _appServerToken
           ),
);

Answer 3

**

如果您希望

，您可以尝试另一种方法

**

class MyApp extends StatelessWidget {
   const MyApp({Key? key}) : super(key: key);
   @override
   Widget build(BuildContext context) {
     return MaterialApp(                   
       initialRoute: LoginScreen.id,
         routes: route,
       );
    },
 }

创建您的路由飞镖文件。无需创建类

var route = <String, WidgetBuilder>{
   LoginScreen.id: (_) => const LoginScreen(),
   // call the classes
   Dashboard.id: (_) => const Dashboard(),
   // with value
   Dashboard.id: (_) => const Dashboard(value: ''),
};

如果您不使用ID呼叫。您也可以做到这一点。另外，您可以传递值显示的示例