在 Web 视图中获取值的速度不够快

Question

嘿，我遇到的问题有点不寻常.. 因此，我正在使用 webviews，作为 intialUrl，我正在使用从 Google cloud_firestore 获得的值。现在从我的 fireStore 数据库中检索这个 link 大约需要 2 秒，在此期间我的代码是运行并认为 'thankGod' 变量为空。所以即使文本小部件也说 'thankGod' 变量在前 2 秒内为空，然后 returns 之后的值..但这不好，因为我的 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 函数创建 return 字符串类型；

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();
  },
)

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

在 Web 视图中获取值的速度不够快

Not getting values in Web view fast enough

database

webview

dart

flutter

google-cloud-firestore