Dart组件：如何返回异步回调的结果？ [英] Dart Component: How to return result of asynchronous callback?

问题描述

嘿，我对Dart Futures很陌生，并且遇到以下情况。

Hey there I am quite new to Dart Futures and I have the following situation.

每当用户在用户界面中键入字母时，我的ui_component中的addressChanged（）方法被调用。此方法在我的地图组件网络中调用方法 getProposals（），该方法向google maps API发出异步请求。结果到这里后，我想将它们返回到UI组件，该组件将填充UI中的propasals下拉菜单。

Whenever a user types a letter in the UI the addressChanged() method in my ui_component is called. This method calls the method getProposals() in my maps componenet which does an asynchronous request to the google maps API. As soon as the results are here I want to return them to the UI Component which is going to populate the propasals dropdown in the UI.

我坚持最后一步：如何（以及最好的方式）将异步回调函数的结果返回给父组件（同时保留可重用的map组件？）。

I am stuck with the last step: How (and whats the best way) to return the results of an asynchronous callback function to a parent component (while keeping an reusable maps component?).

这是什么我试过了：

1）UI_Component：

1) UI_Component:

// I get called if a user typed a new letter
     Future addressChanged(dynamic event) async {
        String id = event.target.id;
        String address = event.target.value;
          if(id=="pickup") {
              this.pickup = address;
          } else if(id=="destination") {
              this.destination = address;
          }
        // this is where I call the subcomponent and want to get the address propasals
        String proposals = await googleMap.getProposals(address,id);
        print(proposals);
        populateProposalDropdown();
      }

2）Google Map组件：

2) Google Map component:

  Future getProposals(String address,String id) async {
    await _getProposals(address,id);
  }

  Future _getProposals(String address,String id) async {

    if(address != "") {
      autocompleteService.getPlacePredictions(
          new AutocompletionRequest()
            ..input = address
          ,
          (predictions,status) {
            List<String> result = [];
            if(status == PlacesServiceStatus.OK) {
              predictions.forEach(
                  (AutocompletePrediction prediction) =>
                      result.add(prediction.description)
              );
            }

            // HERE is the problem: How do I return this result from the callback as a result of the getProposals method?
            return result;
          }
      );
    }
  }

推荐答案

此方法不返回任何数据

  Future getProposals(String address,String id) async {
    await _getProposals(address,id);
  }

将其更改为

  Future getProposals(String address,String id) {
    return _getProposals(address,id);
  }

这也可以，但是在这里 async 和 await 是多余的

This would also work, but here async and await is redunant

  Future getProposals(String address,String id) async {
    return await _getProposals(address,id);
  }

对于 _getProposals 您可以使用 Completer

  Future _getProposals(String address,String id) async {
    if(address != "") {
      Completer completer = new Completer();

      autocompleteService.getPlacePredictions(
          new AutocompletionRequest()
            ..input = address
          ,
          (predictions,status) {
            List<String> result = [];
            if(status == PlacesServiceStatus.OK) {
              predictions.forEach(
                  (AutocompletePrediction prediction) =>
                      result.add(prediction.description)
              );
            }

            // HERE is the problem: How do I return this result from the callback as a result of the getProposals method?
            completer.complete(result);
          }
      );
      return completer.future;
    }
    return null;
  }

这篇关于Dart组件：如何返回异步回调的结果？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！