当第二页在单独的小部件中使用 Navigator.pop 时，Navigator.push 不起作用

Question

我正在尝试使用一个自定义小部件，它使用一个函数来执行 Navigation.pop()。如果我在页面中使用 GestureDetector，从 FirstPage 到 SecondPage 的导航效果很好（注释掉代码）。但是，如果我使用单独的小部件（MyButton）以及应触发 Navigator.pop() 的函数，则 Navigator.push() 不起作用。没有错误。感谢您的帮助。

import 'package:flutter/material.dart';

void main() => runApp(TestNavigation());

class TestNavigation extends StatelessWidget {
  const TestNavigation({super.key});
  @override Widget build(BuildContext context) {
    return const MaterialApp(home: FirstPage());
  }
}

class FirstPage extends StatefulWidget {
  const FirstPage({super.key});
  @override State<FirstPage> createState() => _FirstPageState();
}

class _FirstPageState extends State<FirstPage> {
  @override Widget build(BuildContext context) {
    return Scaffold(
        body: Center(
            child: GestureDetector(
                onTap: () {
                  Navigator.push(
                      context,
                      MaterialPageRoute(
                          builder: (context) => SecondPage()));
                },
                child: const Text(
                  'Click to next Page',
                ))));
  }
}

class SecondPage extends StatelessWidget {
  @override Widget build(BuildContext context) {
    return Scaffold(
        // body: GestureDetector(
        //     onTap: () {
        //       Navigator.pop(context);
        //     },
        //     child: Container(
        //         child: Center(child: Text('Go back to first page')))));
        body: MyButton(
            onTap: () {
              Navigator.pop(context);
            },
            text: 'Go back to first page'));
  }
}

class MyButton extends StatelessWidget {
  final String text;
  final Function onTap;

  const MyButton({required this.text, required this.onTap});

  @override Widget build(BuildContext context) {
    return GestureDetector(
        onTap: onTap(), child: Center(child: Text(text)));
  }
}

没有导航发生。但如果我使用注释掉的代码，那么它就可以工作。

Answer 1

onTap 是一个回调函数，声明为

VoidCallback

。

这是您的自定义小部件，我尝试过并且正在工作：

class MyButton extends StatelessWidget {
  final String text;
  final VoidCallback onTap;

  const MyButton({required this.text, required this.onTap});

  @override Widget build(BuildContext context) {
    return GestureDetector(
        onTap: onTap, child: Center(child: Text(text)));
  }
} 

希望对您有帮助。