如何从Firebase Realtime Database读取传感器值到Flutter(Dart)应用？

你的代码能监听数据库节点但无法正确读取值，核心问题是没有对返回的动态数据进行类型解析。以下是修正后的实现方案，可将四个传感器值分别读取到独立变量中：

修正后的读取代码 #

import 'package:firebase_database/firebase_database.dart';

class Fetch {
  // 定义四个变量存储传感器数据
  double? temperature;
  double? humidity;
  double? waterLevel;
  double? moisture;

  void getData() {
    DatabaseReference ref = FirebaseDatabase.instance.ref('Sensor');
    ref.onValue.listen((DatabaseEvent event) {
      // 判空并将快照值转为Map类型
      if (event.snapshot.value != null) {
        Map<String, dynamic> sensorData = Map<String, dynamic>.from(
          event.snapshot.value as Map
        );
        
        // 提取各字段到独立变量
        temperature = double.tryParse(sensorData['Temperature'].toString());
        humidity = double.tryParse(sensorData['Humidity'].toString());
        waterLevel = double.tryParse(sensorData['Waterlevel'].toString());
        moisture = double.tryParse(sensorData['moisture'].toString());
        
        // 打印验证数据
        print('温度: $temperature, 湿度: $humidity, 水位: $waterLevel, 土壤湿度: $moisture');
      } else {
        print('Sensor节点无数据');
      }
    });
  }
}

关键注意事项 #

• 数据解析：Firebase返回的snapshot.value是动态类型，必须转为Map<String, dynamic>才能提取字段。用double.tryParse可以避免字符串转数字时的异常，若数据库中存储的是数字类型，也可直接用as double转换。
• 权限配置：确保Firebase数据库权限允许读取，开发阶段可临时设置公开权限（上线后需修改为安全规则）：

  {
    "rules": {
      ".read": true,
      ".write": true
    }
  }
  

• UI展示：如果要在Flutter界面中实时展示数据，可结合StatefulWidget或状态管理工具，在数据更新时触发UI刷新：

  class SensorScreen extends StatefulWidget {
    const SensorScreen({super.key});
  
    @override
    State<SensorScreen> createState() => _SensorScreenState();
  }
  
  class _SensorScreenState extends State<SensorScreen> {
    final Fetch _fetch = Fetch();
  
    @override
    void initState() {
      super.initState();
      _fetch.getData();
    }
  
    @override
    Widget build(BuildContext context) {
      return Scaffold(
        appBar: AppBar(title: const Text('传感器数据')),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Text('温度: ${_fetch.temperature ?? '未获取'}'),
              Text('湿度: ${_fetch.humidity ?? '未获取'}'),
              Text('水位: ${_fetch.waterLevel ?? '未获取'}'),
              Text('土壤湿度: ${_fetch.moisture ?? '未获取'}'),
            ],
          ),
        ),
      );
    }
  }
  

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