Flutter页面传值异常：TextFormField值无法在StatefulWidget页面显示

核心问题分析 #

你遇到的页面内容为空的情况，大概率是以下几个原因导致：

1. Controller变量名大小写不一致：登录页中TextFormField绑定的是name_Controller（大写C），但signIn方法中使用的是name_controller（小写c），这是两个完全独立的变量；如果name_Controller未正确初始化，或实际输入内容存在于未绑定的controller中，会导致传递给demoScreen的是空字符串，Text组件自然无内容显示。
2. 接收页面参数未规范声明：demoScreen的test变量未声明为final且无明确类型，可能引发参数传递异常。
3. Text组件样式不明确：若传递内容为空，或Text颜色与页面背景色一致，视觉上会表现为“内容区域为空”。

修复步骤 #

1. 统一Controller变量名并确保初始化 #

在登录页的State类中正确初始化controller，并统一所有使用该变量的地方：

// 在State类中初始化controller
final TextEditingController name_Controller = TextEditingController();

// 修改signIn方法中的变量名，与TextFormField绑定的controller一致
Future<String?> signIn() async {
  var dio = Dio();
  try {
    var response = await dio.post('https://abc.in/xyz/test.php',
        data: {
          "method"  : "login_check",
          "username" : name_Controller.text, // 统一为name_Controller（大写C）
          "pass" : _passwd
        },
        options: Options(
            headers: {
              'Content-Type': 'application/json',
              'Accept': 'application/json'
            }
        ));
    mapResponse = jsonDecode(response.data);
    var x = mapResponse['data'][0]['sucess'];
    return x;
  } catch (e) {
    print(e.toString());
  }
  return null;
}

2. 规范接收页面的参数声明 #

修改demoScreen代码，将参数声明为final并指定明确类型，同时优化组件布局确保内容可见：

import 'package:flutter/material.dart';

class demoScreen extends StatefulWidget {
  final String test; // 声明为final并指定String类型
  const demoScreen(this.test, {super.key}); // 添加key参数，符合Flutter规范

  @override
  State<demoScreen> createState() => _demoScreenState();
}

class _demoScreenState extends State<demoScreen> {
  @override
  Widget build(BuildContext context) {
    // 打印参数，确认是否接收到值
    print("Received value: ${widget.test}");
    return Scaffold(
      appBar: const AppBar(
        title: Text('demo'),
      ),
      body: Center( // 用Center包裹，确保Text在页面居中显示
        child: Text(
          '${widget.test}',
          style: const TextStyle(fontSize: 18, color: Colors.black87), // 指定样式，避免颜色问题
        ),
      ),
    );
  }
}

3. 跳转前确认参数值 #

在登录页的跳转代码前，先打印name_Controller.text，确认传递的内容不为空：

if(response == '1')
{
  print("Name to pass: ${name_Controller.text}"); // 打印确认值
  Navigator.push(
      context,
      MaterialPageRoute(builder: (context) => demoScreen(name_Controller.text))
  );
}

额外注意事项 #

• 记得在登录页的dispose方法中释放controller资源，避免内存泄漏：

@override
void dispose() {
  name_Controller.dispose();
  super.dispose();
}

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