Flutter页面传值异常：点击按钮触发Exception caught by gesture

核心问题分析 #

1. 循环导入错误：Welcome.dart中导入了自身import 'package:pharmacy/Welcome.dart';，导致编译异常。
2. Context获取错误：原MyApp是StatelessWidget，使用的context属于MaterialApp，无法获取内部的Navigator实例，导致跳转失败。
3. StatelessWidget使用可变状态：TextEditingController是可变对象，放在StatelessWidget类中不符合其设计规范，可能引发状态异常。

修复后的代码 #

main.dart

import 'package:flutter/material.dart';
import 'package:pharmacy/Welcome.dart';

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

class MyApp extends StatefulWidget {
  const MyApp({super.key});

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  final TextEditingController _name = TextEditingController();
  final TextEditingController _email = TextEditingController();
  final TextEditingController _phone = TextEditingController();

  @override
  void dispose() {
    // 销毁控制器，避免内存泄漏
    _name.dispose();
    _email.dispose();
    _phone.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Padding(
              padding: const EdgeInsets.all(8.0),
              child: TextField(
                controller: _name,
                decoration: const InputDecoration(
                  border: OutlineInputBorder(),
                  labelText: 'Name',
                ),
              ),
            ),
            Padding(
              padding: const EdgeInsets.all(8.0),
              child: TextField(
                controller: _email,
                decoration: const InputDecoration(
                  border: OutlineInputBorder(),
                  labelText: 'Email',
                ),
              ),
            ),
            Padding(
              padding: const EdgeInsets.all(8.0),
              child: TextField(
                controller: _phone,
                decoration: const InputDecoration(
                  border: OutlineInputBorder(),
                  labelText: 'Phone',
                ),
              ),
            ),
            const SizedBox(height: 10),
            ElevatedButton(
              onPressed: () {
                Navigator.of(context).push(
                  MaterialPageRoute(
                    builder: (context) => Welcome(
                      name: _name.text,
                      email: _email.text,
                      phone: _phone.text,
                    ),
                  ),
                );
              },
              child: const Text('SEND'),
            )
          ],
        ),
      ),
    );
  }
}

Welcome.dart

import 'package:flutter/material.dart';

class Welcome extends StatelessWidget {
  final String name, email, phone;

  const Welcome({
    super.key,
    required this.name,
    required this.email,
    required this.phone,
  });

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Text('Name = $name'),
          Text('Email = $email'),
          Text('Phone = $phone'),
        ],
      ),
    );
  }
}

关键修复点 #

• 移除Welcome.dart中的自引用导入，解决循环依赖问题。
• 将MyApp改为StatefulWidget，把TextEditingController移至State类中，并添加dispose方法管理控制器生命周期，避免内存泄漏。
• 使用Dart 2.12+推荐的required关键字替代过时的@required。
• 为Widget添加super.key，符合Flutter最新最佳实践。

内容的提问来源于stack exchange，提问作者Miles