Flutter namedRoutes 没有导航到点击的屏幕但没有抛出错误日志

Question

我一直在尝试将 namedRoutes 与自定义 'NavLink' 组件一起使用以添加到我的抽屉中，但链接没有导航到单击的屏幕。当我单击它们时，它们不会抛出错误日志，所以我不知道发生了什么。

main.dart

    import 'package:flutter/material.dart';
import 'package:hire_me/homepage.dart';
import 'package:hire_me/screens/notFound.dart';
import 'package:hire_me/screens/todoList.dart';
import 'package:hire_me/screens/nodeJs.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        title: 'My Portfolio',
        theme: ThemeData(
            primarySwatch: Colors.blue,
            textTheme: TextTheme(
                headline1: TextStyle(
                    fontSize: 36.0,
                    fontWeight: FontWeight.bold,
                    color: Colors.black),
                headline2:
                    TextStyle(fontSize: 18.0, fontWeight: FontWeight.bold),
                bodyText1:
                    TextStyle(fontSize: 12.0, fontWeight: FontWeight.normal))),
        initialRoute: '/',
        routes: {
          '/': (context) => HomePage(),
          '/todoList': (context) => TodoList(),
          '/nodeJs': (context) => NodeJs(),
          '/notFound': (context) => NotFound(),
        });
  }
}

主页组件

    class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Carlos Gumucio'),
        centerTitle: true,
      ),
      drawer: Drawer(
          child: ListView(
        padding: EdgeInsets.zero,
        children: <Widget>[
          DrawerHeader(
              decoration: BoxDecoration(
                color: Colors.blue,
              ),
              child: Text('More from me')),
          NavLink(title: 'Todo List', route: '/todoList'),
          NavLink(title: 'NodeJs API', route: '/nodeJs'),
        ],
      )),
      body: SingleChildScrollView(...

navLink.dart分量

    import 'package:flutter/material.dart';

class NavLink extends StatelessWidget {
  const NavLink({Key? key, this.title = 'link here', this.route = '/notFound'})
      : super(key: key);

  final String title;
  final String route;

  @override
  Widget build(BuildContext context) {
    return ListTile(
        title: Text(title),
        onTap: () {
          // go to route ... Navigator.push(context, route)
          Navigator.pushNamed(context, route);
          // close the nav after navigating
          Navigator.pop(context);
        });
  }
}

pubspec.yaml

    name: hire_me
description: Reach me hub.

publish_to: 'none'

version: 1.0.0+1

environment:
  sdk: ">=2.12.0 <3.0.0"

dependencies:
  flutter:
    sdk: flutter


  # The following adds the Cupertino Icons font to your application.
  # Use with the CupertinoIcons class for iOS style icons.
  cupertino_icons: ^1.0.2
  url_launcher: ^6.0.4
  material_design_icons_flutter: ^4.0.5955
  google_fonts: ^2.0.0
  
dev_dependencies:
  flutter_test:
    sdk: flutter

# For information on the generic Dart part of this file, see the
# following page: https://dart.dev/tools/pub/pubspec

# The following section is specific to Flutter.
flutter:

  # The following line ensures that the Material Icons font is
  # included with your application, so that you can use the icons in
  # the material Icons class.
  uses-material-design: true

  assets:
    - assets/images/

扑博士

[√] Flutter (Channel beta, 2.2.0-10.3.pre, on Microsoft Windows [VersiÃ³n 10.0.19042.985], locale
    es-CL)
[√] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
[√] Chrome - develop for the web
[√] Android Studio
[√] VS Code (version 1.56.0)
[√] Connected device (2 available)

• No issues found!

Answer 1

嗯，我看到你一推就弹屏了：

@override
  Widget build(BuildContext context) {
    return ListTile(
        title: Text(title),
        onTap: () {
          // go to route ... Navigator.push(context, route)
          Navigator.pushNamed(context, route);
          // close the nav after navigating
          Navigator.pop(context); // This will pop your last pushed route
        });
  }

尝试注释掉 Navigator.pop(context); 行。

编辑 1：

在推送新路由之前关闭抽屉：

@override
  Widget build(BuildContext context) {
    return ListTile(
        title: Text(title),
        onTap: () {
          // close the nav before navigating
          Navigator.pop(context); // This will pop your last pushed 
          // go to route ... Navigator.push(context, route)
          Navigator.pushNamed(context, route);
          route
        });
  }

Flutter namedRoutes 没有导航到点击的屏幕但没有抛出错误日志

Flutter namedRoutes are not navigating to clicked screen but throw no error log

navigation

debugging

routes

issue-tracking

flutter