从 Firebase 中检索实时数据

Question

我设置了一个颤振项目来接收来自 firebase 的湿度传感器数据。我正在将数据上传到 firebase 并尝试在我的应用程序上检索它，但它只会在一段时间后检索数据。此外，在此之前该值为 null。而且，当更改时，应用程序上的数据没有变化。如何获取数据，以便它显示从我启动应用程序的那一刻起的数据，并在 firebase 上的数据更新时更改？这是我的代码。

  double moistureData;

  @override
  bool _isLoading = false;
  void initState() {
    super.initState();
    databaseReference.child('Data').once().then((DataSnapshot snapshot) {
      int moisture = snapshot.value['Moisture'];
      moistureData = moisture.toDouble();
      print(moisture);
      setState(() {
        if (moistureData != null) {
        _isLoading = true;
        }
      });
    });
  }
  @override
  Widget build(BuildContext context) {

    return Scaffold(
        appBar: AppBar(
          title: Text('Moisture'),
        ),
        body: StreamBuilder(
            stream: databaseReference.child('Data').child('Moisture').onValue,
            builder: (context, snapshot) {
              if (!snapshot.hasData) {
                return CircularProgressIndicator();
              } else {
                return Center(
                  child: Padding(
                    padding: const EdgeInsets.all(20),
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.spaceAround,
                      children: <Widget>[
                        Text('$moistureData'),
                        RaisedButton(
                          child: Text('Refresh'),
                          onPressed: () {
                            setState(() {
                              databaseReference
                                  .child('Data')
                                  .once()
                                  .then((DataSnapshot snapshot) {
                                int moisture = snapshot.value['Moisture'];
                                moistureData = moisture.toDouble();
                              });
                            });
                          },
                        )
                      ],
                    ),
                  ),
                );
              }
            }));

Answer 1

当然，从 firebase 加载数据、创建一个 bool 变量并将其设置为 false 需要一些时间。

double moistureData;
bool _isLoading=false;
  @override
  void initState() {
    super.initState();
    databaseReference.child('Data').once().then((DataSnapshot snapshot) {
      final int moisture = snapshot.value['Moisture'];
      moistureData=moisture.toDouble();
      print(moisture);
    setState((){
    if(moistureData!=null)
     _isLoading=true;
      });
    });
  }

当 _isLoading 为 false 时，在您的小部件传递中，循环进度指示器或空容器。当它是真的在 else 中调用你的小部件。

Answer 2

要同时侦听当前值和更新，您需要观察query object 的on... 流属性之一。最接近您当前代码的是onValue 流。

来自FlutterFire example app的例子：

_counterRef.onValue.listen((Event event) {
  setState(() {
    _error = null;
    _counter = event.snapshot.value ?? 0;
  });
}

所以你看到这也使用了@satish's answer 解释的setState(...)。