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

Posted 2023-02-23

【中文标题】在 Web 视图中获取值的速度不够快

【英文标题】：Not getting values in Web view fast enough

【发布时间】：2020-08-15 09:27:47

【问题描述】：

嘿，我遇到的问题有点不寻常.. 因此，我正在使用 webviews，并且作为 intialUrl，我使用的是从 Google cloud_firestore 获得的值。现在从我的 fireStore 数据库中检索此链接大约需要 2 秒，在此期间，我的代码正在运行，并且认为“thankGod” ' 变量是空的.. 所以即使是 Text 小部件也说 'thankGod' 变量在前 2 秒内为空，然后在之后返回值.. 但这不好，因为我的 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);
             ),
            ),


   ));

  

我需要帮助..帮我分享这个问题

【参考方案1】：

为您的 getData 函数创建返回类型字符串；

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()。