Flutter：如何将 Future<String> 转换为 String？

Question

我使用 API 从数据库中获取图像。我有这样的回应：

{
    "status": "ok",
    "message": "Logo Client Is Found",
    "data": [
        {
            "fileInfo": "img-1.png"
        }
    ]
}

我想使用以下代码从 API 获取该值：

 Future<String> getLogoClient() async {
    final response = await _client.get("$_baseUrl/getLogoClient");
    final Map<String, dynamic> responseJson = json.decode(response.body);
    if (responseJson["status"] == "ok") {
      List image = responseJson["data"];
      final imageList =
          image.map((json) => AppInfoModel.logoFromJson(json)).toList();
      final singleImage = imageList.single.fileInfo;
      final String urlImage = "$baseImageUrl/$singleImage";
      print(urlImage);
      return urlImage;
    } else {
      throw CustomError(responseJson["message"]);
    }
  }

打印响应：

http://---/images/info/img-1.png

问题是，我想将值从 Future 转换为 String我该怎么做？

我已经尝试使用此代码并成功转换该值：

String urlImageApi = "";
  _getImage() async {
    final result = await appInfoApi.getLogoClient();
    setState(() {
      urlImageApi = result;
    });
  }

  @override
  void initState() {
    super.initState();
    _getImage();
  }

但我得到错误：

I/flutter ( 8408): #644    ComponentElement.performRebuild 
package:flutter/…/widgets/framework.dart:4243
I/flutter ( 8408): #645    Element.rebuild 
package:flutter/…/widgets/framework.dart:3947
I/flutter ( 8408): #646    ComponentElement._firstBuild 
package:flutter/…/widgets/framework.dart:4206
I/flutter ( 8408): #647    StatefulElement._firstBuild 
package:flutter/…/widgets/framework.dart:4381
I/flutter ( 8408): #648    ComponentElement.mount 
package:flutter/…/widgets/framework.dart:4201
I/flutter ( 8408): #649    Element.inflateWidget 
package:flutter/…/widgets/framework.dart:3194
I/flutter ( 8408): #650    Element.updateChild 
package:flutter/…/widgets/framework.dart:2988
I/flutter ( 8408): #651    ComponentElement.performRebuild 
package:flutter/…/widgets/framework.dart:4243
I/flutter ( 8408): #652    Element.rebuild 
package:flutter/…/widgets/framework.dart:3947
I/flutter ( 8408): #653    ComponentElement._firstBuild 
package:flutter/…/widgets/framework.dart:4206
I/flutter ( 8408): #654    ComponentElement.mount 
package:flutter/…/widgets/framework.dart:4201
I/flutter ( 8408): #655    Element.inflateWidget 
package:flutter/…/widgets/framework.dart:3194
I/flutter ( 8408): #656    Element.updateChild 
package:flutter/…/widgets/framework.dart:2988
I/flutter ( 8408): #657    ComponentElement.performRebuild 
package:flutter/…/widgets/framework.dart:4243
I/flutter ( 8408): #658    Element.rebuild 
package:flutter/…/widgets/framework.dart:3947
I/flutter ( 8408): #659    ComponentElement._firstBuild 
package:flutter/…/widgets/framework.dart:4206
I/flutter ( 8408): #660    StatefulElement._firstBuild 
package:flutter/…/widgets/framework.dart:4381
I/flutter ( 8408): #661    ComponentElement.mount 
package:flutter/…/widgets/framework.dart:4201
I/flutter ( 8408): #662    Element.inflateWidget 
package:flutter/…/widgets/framework.dart:3194
I/flutter ( 8408): #663    Element.updateChild 
package:flutter/…/widgets/framework.dart:2988
I/flutter ( 8408): #664    ComponentElement.performRebuild 
package:flutter/…/widgets/framework.dart:4243
I/flutter ( 8408): #665    Element.rebuild 
package:flutter/…/widgets/framework.dart:3947
I/flutter ( 8408): #666    ComponentElement._firstBuild 
package:flutter/…/widgets/framework.dart:4206
I/flutter ( 8408): #667    ComponentElement.mount 
package:flutter/…/widgets/framework.dart:4201
I/flutter ( 8408): #668    Element.inflateWidget 
package:flutter/…/widgets/framework.dart:3194
I/flutter ( 8408): #669    Element.updateChild 
package:flutter/…/widgets/framework.dart:2988
I/flutter ( 8408): #670    RenderObjectToWidgetElement._rebuild 
package:flutter/…/widgets/binding.dart:1028
I/flutter ( 8408): #671    RenderObjectToWidgetElement.mount 
package:flutter/…/widgets/binding.dart:999
I/flutter ( 8408): #672    RenderObjectToWidgetAdapter.attachToRenderTree.<anonymous closure> 
package:flutter/…/widgets/binding.dart:942
I/flutter ( 8408): #673    BuildOwner.buildScope 
package:flutter/…/widgets/framework.dart:2412
I/flutter ( 8408): #674    RenderObjectToWidgetAdapter.attachToRenderTree 
package:flutter/…/widgets/binding.dart:941
I/flutter ( 8408): #675    WidgetsBinding.attachRootWidget 
package:flutter/…/widgets/binding.dart:819
I/flutter ( 8408): #676    WidgetsBinding.scheduleAttachRootWidget.<anonymous closure> 
package:flutter/…/widgets/binding.dart:804
I/flutter ( 8408): #685    _Timer._runTimers  (dart:isolate-patch/timer_impl.dart:384:19)
I/flutter ( 8408): #686    _Timer._handleMessage  (dart:isolate-patch/timer_impl.dart:418:5)
I/flutter ( 8408): #687    _RawReceivePortImpl._handleMessage  (dart:isolate-patch/isolate_patch.dart:174:12)
I/flutter ( 8408): (elided 11 frames from package dart:async and package dart:async-patch)
I/flutter ( 8408):
I/flutter ( 8408): Image provider: NetworkImage("", scale: 1.0)
I/flutter ( 8408): Image key: NetworkImage("", scale: 1.0)
I/flutter ( 8408): ????????????????????????????????????????????????????????????????????????????????????????????????????

我想念什么？

Answer 1

您可以使用 then 方法并将 Future 转换为 String。

appInfoApi.getLogoClient().then((String result){
setState(() {
      urlImageApi = result;
    });
});

Answer 2

您收到错误的原因是因为您await正在initState. Flutter 期望中的代码initState是非阻塞的，因为它不能等待initState完成执行，Flutter 需要立即渲染 UI 元素。

您可以使用类似此处then的方法来完成此操作。另一种方法是使用Timer#run方法，如下所示：Future

Timer.run(() async {
    String urlImageApi = await appInfoApi.getLogoClient();
    setState(() {
      urlImageApi = result;
    });
})

这里说明了上述代码起作用的原因