Flutter中TextFormField无法显示Firebase用户名的问题求助

问题核心在于你初始化_usernameController时，userData还没从Firebase获取到数据，此时userData['username']为null，导致输入框无法显示内容；且异步获取数据后，没有同步更新控制器的文本值。

修改方案： #

1. 移除initState中提前给控制器赋值的代码，只保留异步获取数据的调用
2. 在getData方法拿到Firebase数据后，更新控制器文本并触发UI刷新
3. 组件销毁时释放控制器资源，避免内存泄漏

修改后的完整代码示例： #

class _EditProfileState extends State<EditProfile> {
  var userData = {};
  late TextEditingController _usernameController;
  late TextEditingController _bioController;

  @override
  void initState() {
    super.initState();
    // 先初始化空控制器
    _usernameController = TextEditingController();
    _bioController = TextEditingController();
    // 异步拉取用户数据
    getData();
  }

  // 替换成你的Firebase数据查询逻辑
  Future<void> getData() async {
    final userDoc = await FirebaseFirestore.instance
        .collection('users')
        .doc(FirebaseAuth.instance.currentUser?.uid)
        .get();
    
    if (mounted) {
      setState(() {
        userData = userDoc.data() ?? {};
        // 拿到数据后更新控制器文本
        _usernameController.text = userData['username'] ?? '';
        _bioController.text = userData['bio'] ?? '';
      });
    }
  }

  @override
  void dispose() {
    // 释放控制器资源
    _usernameController.dispose();
    _bioController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: TextFormField(
        keyboardType: TextInputType.name,
        controller: _usernameController,
        autofocus: false,
        decoration: InputDecoration(
          prefixIcon: const Icon(Icons.supervised_user_circle_rounded),
          hintText: '请输入用户名', // 设置默认提示，避免userData为空时显示null
          labelText: '用户名',
          contentPadding: const EdgeInsets.fromLTRB(20.0, 15.0, 20.0, 15.0),
          border: OutlineInputBorder(
              borderRadius: BorderRadius.circular(32.0)),
        ),
      ),
    );
  }
}

额外说明： #

• 用mounted判断是为了避免组件销毁后异步请求才完成，调用setState引发错误
• 给hintText和labelText设置默认值，优化数据加载完成前的UI体验
• 控制器声明用late关键字，明确后续会在initState中完成初始化

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