Flutter配合Firebase开发设置页时StreamBuilder报name空值错误

StreamBuilder在首次构建时，Firebase的异步数据流还未返回数据，此时snapshot.data为null，你直接对null值访问name属性就触发了该报错。

按以下步骤调整代码即可：

• 先在StreamBuilder的builder中加入加载状态判断，只有拿到合法的UserData数据后再渲染表单
• 同步初始化表单本地变量的默认值，避免后续提交表单时取值为null
• 加入空安全兜底，避免后端字段为空时的异常

修正后参考代码：

class SettingsFormTwo extends StatefulWidget {
  @override
  _SettingsFormState createState() => _SettingsFormState();
}

class _SettingsFormState extends State<SettingsFormTwo> {

  final _formKey = GlobalKey<FormState>();
  final List<String> sugars = ['0', '1', '2', '3', '4'];
  final List<int> strengths = [100, 200, 300, 400, 500, 600, 700, 800, 900];

  // form values
  String? _currentName;
  String? _currentSugars;
  int? _currentStrength;

  @override
  Widget build(BuildContext context) {

    Player player = Provider.of<Player>(context);

    return StreamBuilder<UserData>(
        stream: DatabaseService(uid: player.uid).userData,
        builder: (context, snapshot) {
            // 新增加载状态判断
            if (snapshot.connectionState == ConnectionState.waiting) {
              return const Center(child: CircularProgressIndicator());
            }
            if (!snapshot.hasData || snapshot.data == null) {
              return const Center(child: Text('加载用户数据失败'));
            }
            UserData userData = snapshot.data!;
            // 初始化本地表单变量默认值
            _currentName ??= userData.name ?? '';
            _currentSugars ??= userData.sugars ?? '0';
            _currentStrength ??= userData.strength ?? 100;
            
            return Form(
              key: _formKey,
              child: Column(
                children: <Widget>[
                  const Text(
                    'Update your brew settings.',
                    style: TextStyle(fontSize: 18.0),
                  ),
                  SizedBox(height: 20.0),
                  TextFormField(
                    initialValue: userData.name ?? '', // 新增空值兜底
                    decoration: textDecoration,
                    validator: (val) => val?.isEmpty ?? true ? 'Please enter a name' : null,
                    onChanged: (val) => setState(() => _currentName = val),
                  ),
                ],
              ),
            );
          }
    );
  }
}

• 如果你的项目是 Flutter 2.0+ 空安全版本，所有可空变量都要加上?标记，避免编译报错
• 提交表单前要校验_formKey.currentState?.validate()为true后再调用Firebase更新接口，避免空数据提交

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