Flutter向Firestore添加数据时数值字段mileage始终为null的问题

让我来帮你排查一下代码里的问题，主要有几个关键点导致mileage字段始终为null：

1. InputFieldTile的onChanged参数类型不匹配 #

你在InputFieldTile里把onChanged声明为泛泛的Function类型，但Flutter的TextFormField.onChanged需要的是ValueChanged<String>（也就是void Function(String)）。这种类型不匹配可能导致回调无法正确接收输入框的字符串值，父组件里的mileage = value.toDouble()根本没被执行，所以mileage一直保持初始的null值。

2. 空安全下变量未初始化（或未处理空值） #

如果你的项目开启了空安全，double mileage;这种写法是不合法的，你肯定是声明成了double? mileage;（可空类型），初始值就是null。要是回调没触发，这个变量自然不会被赋值，写入Firestore时就是null。

3. InputFieldTile内部维护controller的隐患 #

你在StatelessWidget内部初始化了TextEditingController，但StatelessWidget是不可变的，一旦父组件重新build，InputFieldTile会被重新实例化，controller也会被重置，之前的输入内容可能丢失，进一步导致回调失效。另外，你定义的onChangeCallBack函数完全没被使用，属于冗余代码，可以删掉。

修复方案 #

方案一：修正onChanged参数类型（快速修复） #

先把InputFieldTile里的onChanged类型改成正确的ValueChanged<String>?，确保回调能正常传递值：

class InputFieldTile extends StatelessWidget {
  InputFieldTile({this.label, this.keyboardType, this.onChanged});
  final String label;
  final TextInputType keyboardType;
  // 修改为正确的回调类型
  final ValueChanged<String>? onChanged;
  // controller设为final，符合StatelessWidget的不可变性要求
  final TextEditingController controller = TextEditingController();

  @override
  Widget build(BuildContext context) {
    return Container(
      width: double.infinity,
      child: ListTile(
        leading: Text(
          label,
          style: TextStyle(color: Colors.white),
        ),
        title: TextFormField(
          controller: controller,
          onChanged: onChanged, // 现在类型匹配，能正确传递输入值
          style: TextStyle(color: Colors.white),
          textAlign: TextAlign.right,
          cursorColor: Colors.white,
          keyboardType: keyboardType,
          decoration: InputDecoration(
            focusedBorder: UnderlineInputBorder(
              borderSide: BorderSide(color: Colors.white),
            ),
          ),
        ),
      ),
    );
  }
}

然后在父组件里，处理空值避免写入null到Firestore：

// 空安全下声明可空变量，或直接初始化默认值
double? mileage;
String? nickName;

// 添加数据时处理空值
_firestore.collection('Users').add({
  'nick_name': nickName ?? '', // 为空时用默认空字符串
  'data': {
    'mileage': mileage ?? 0.0, // 为空时用默认0.0，避免null
    'dummy': 'Dummy'
  }
});

方案二：父组件管理controller（更推荐） #

更好的做法是让父组件负责管理TextEditingController，这样可以直接获取输入值，不需要依赖回调，避免回调失效的问题：

第一步：修改InputFieldTile，让controller由父组件传入

class InputFieldTile extends StatelessWidget {
  // 这里controller设为required，确保父组件传入
  const InputFieldTile({
    super.key,
    required this.label,
    this.keyboardType,
    required this.controller,
  });

  final String label;
  final TextInputType? keyboardType;
  final TextEditingController controller;

  @override
  Widget build(BuildContext context) {
    return Container(
      width: double.infinity,
      child: ListTile(
        leading: Text(
          label,
          style: TextStyle(color: Colors.white),
        ),
        title: TextFormField(
          controller: controller,
          style: TextStyle(color: Colors.white),
          textAlign: TextAlign.right,
          cursorColor: Colors.white,
          keyboardType: keyboardType,
          decoration: InputDecoration(
            focusedBorder: UnderlineInputBorder(
              borderSide: BorderSide(color: Colors.white),
            ),
          ),
        ),
      ),
    );
  }
}

第二步：父组件中使用controller获取值

// 在父组件里初始化controller
final nickNameController = TextEditingController();
final mileageController = TextEditingController();

// 构建InputFieldTile时传入controller
InputFieldTile(
  label: 'Nick Name',
  keyboardType: TextInputType.text,
  controller: nickNameController,
),
InputFieldTile(
  label: 'Mileage(km)',
  keyboardType: TextInputType.number,
  controller: mileageController,
),

// 添加数据时直接从controller获取值，并用tryParse处理非数字输入
final nickName = nickNameController.text;
// 用tryParse避免输入非数字时抛出异常，为空或非数字时用0.0兜底
final mileage = double.tryParse(mileageController.text) ?? 0.0;

_firestore.collection('Users').add({
  'nick_name': nickName,
  'data': {
    'mileage': mileage,
    'dummy': 'Dummy'
  }
});

这种方式更符合Flutter的状态管理思路，父组件掌控输入状态，子组件只负责UI展示和交互，也能避免回调相关的各种问题。

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