Flutter初始化String变量后无法更新 跨页面取值为默认值
问题原因
你无法获取到更新后holeCode值的核心逻辑错误:
- 在
otp.dart中手动通过final Inputform ani= new Inputform ();创建的Inputform实例,和页面上实际渲染、接收用户输入的Inputform组件是完全独立的两个对象。 - 输入框
onChanged回调里修改的是路由挂载的Inputform实例的属性,你手动实例化的ani对象从未被渲染、从未触发过输入更新逻辑,它的属性永远停留在初始化的default值;如果把holeCode声明为late,因为你从未给这个独立实例的属性赋值,取值时自然返回Null。 - 额外代码问题:StatefulWidget本身是不可变的,不适合直接存储可变状态;字符串和数字直接拼接会触发类型错误;原代码中TextFormField存在多余闭合括号的语法问题。
修复方案
跨页面取值不要手动实例化目标页面对象,通过路由传参的方式同步值即可,修改后的代码如下:
- 调整
inputform.dart,将可变状态存入State类,跳转OTP页面时传入最新的holeCode值:
import 'package:flutter/material.dart'; import 'otp.dart'; class Inputform extends StatefulWidget { @override State<Inputform> createState() => InputformState(); } class InputformState extends State<Inputform> { List<String> code = ["","","","","",""]; String holeCode = "default"; @override Widget build(BuildContext context) { return TextFormField( onChanged: (value) { setState(() { code[0] = value; // 数字转字符串后再拼接 holeCode = "${code[0]}222205"; }); if (value.length == 1) { FocusScope.of(context).nextFocus(); } // 输入完成跳转OTP页时传参 Navigator.push( context, MaterialPageRoute( builder: (context) => OtpVerification(holeCode: holeCode), ), ); }, ); } }
- 调整
otp.dart,通过构造函数接收传入的参数,不要手动创建Inputform实例:
import 'package:flutter/material.dart'; class OtpVerification extends StatefulWidget { final String holeCode; const OtpVerification({super.key, required this.holeCode}); @override State<StatefulWidget> createState() => Otp(); } class Otp extends State<OtpVerification> { @override Widget build(BuildContext context) { return Scaffold( body: TextButton( onPressed: () { // 直接读取组件接收的传值即可 print(widget.holeCode); }, child: const Text("打印holeCode"), ), ); } }
如果两个页面为同级页面、不存在直接跳转逻辑,可使用InheritedWidget、Provider等状态管理方案做全局状态同步,核心原则是不要手动实例化其他页面的Widget类来读取状态,不同Widget实例的状态是完全隔离的。
内容的提问来源于stack exchange,提问作者saad tabban
相关产品推荐
相关产品推荐

