database - 在Web View 中获取值的速度不够快

Question

嘿，我遇到的问题有点奇怪。
因此，我正在使用webviews，并且作为intialUrl，我正在使用从Google cloud_ firestore获取的值。现在，从我的fireStore数据库检索此链接大约需要2秒，在这段时间内，我的代码正在运行，并认为'thankGod '变量为空。因此，即使Text小部件也说'thankGod'变量在开始的2秒内为null，然后在之后返回值。.但这不是很好，因为我的webView在使用'thankGod'变量时空..这是我的代码。

import 'dart:async';

import 'package:flutter/material.dart';
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:webview_flutter/webview_flutter.dart';


class Home extends StatefulWidget {
  @override
  _HomeState createState() => _HomeState();
}


class _HomeState extends State<Home> {
final Completer<WebViewController> _completer = Completer<WebViewController>();
DocumentReference documentReference = Firestore.instance.collection('dailyPictures').document('t1');
    Future<void> getData() async{
     await documentReference.get().then((datasnapshots) {

                setState(() {
                   thankGod = datasnapshots.data['picture1'];
                });

     });
   }


String thankGod;


   @override
  void initState() {
    super.initState();
    getData();



  }

@override
   Widget build(BuildContext context) {
   return Scaffold(
       backgroundColor: Colors.black,
        body: Container(
        decoration: BoxDecoration(
            borderRadius: BorderRadius.circular(1800),
            ),
        height: MediaQuery.of(context).size.height,
        width: MediaQuery.of(context).size.width,
        margin: EdgeInsets.fromLTRB(
        20,
        20,
        20,
        20
        ),
        child: 
        Text(
          thankGod,
          style: TextStyle(
            color: Colors.white,
            fontSize:32
          ),
        )

               WebView(
         initialUrl: thankGod,
         debuggingEnabled: true,
         javascriptMode: JavascriptMode.unrestricted,
         onWebViewCreated: ((WebViewController webViewController){

           _completer.complete(webViewController);
             }),
            ),


   ));

  }
}

请我需要帮助。帮助我分享这个问题

Answer 1

使getData函数的返回类型为String；

Future<String> getData() async {
  DocumentSnapshot = await documentReference.get();
  return datasnapshots.data['picture1'];
}

并使用FutureBuilder获取数据并构建WebView；

FutureBuilder<String>(
  future: getData(),
  builder: (context, snapshot) {
    if (snapshot.hasData) {
      String initialUrl = snapshot.data;
      return WebView(
        initialUrl: initialUrl,
        debuggingEnabled: true,
        javascriptMode: JavascriptMode.unrestricted,
        onWebViewCreated: ((WebViewController webViewController) {
          _completer.complete(webViewController);
        }),
      );
    }
    return CircularProgressIndicator();
  },
)

注意:您不需要在 getData()内调用 initState。