首页 > 解决方案 > Flutter:将来自 http 调用的 Future 响应捕获为普通列表

问题描述

我正在尝试通过调用后端服务器来使我以前的静态应用程序动态化。

这就是我的服务的样子

String _url = "http://localhost:19013/template/listAll";

Future<List<TemplateInfoModel>> fetchTemplates() async {
  final response =
  await http.get(_url);
  print(response.statusCode);

  if (response.statusCode == 200) {
    // If the call to the server was successful, parse the JSON
    Iterable l = json.decode(response.body);
    List<TemplateInfoModel> templates = l.map((i) => TemplateInfoModel.fromJson(i)).toList();
    return templates;
  } else {
  // If that call was not successful, throw an error.
  throw Exception('Failed to load post');
  }
}

我的模型看起来像这样:

class TemplateInfoModel {
  final String templateId;
  final String messageTag;
  final String message;
  final String messageType;


  TemplateInfoModel({this.templateId, this.messageTag, this.message,
    this.messageType});

  factory TemplateInfoModel.fromJson(Map<String, dynamic> json) {
    return TemplateInfoModel ( templateId: json['templateId'], messageTag : json['messsageTag'], message : json ['message'] , messageType : json['messageType']);
  }

}

我有一个 utils 方法,我在其中捕获 http 请求/响应数据;然后它将使用它来创建一个 DropDown 小部件(或在文本中显示它)

我之前的虚拟数据是一个列表;我想知道如何最好地将这个 Future> 转换为 List

class SMSTemplatingEngine {

    var _SMSTemplate; //TODO this becomes a Future<List<TemplateInfoModels>>
   // TemplateInfoService _templateInfoService;

    SMSTemplatingEngine(){
      _SMSTemplate=fetchTemplates();
    }

//  var _SMSTemplate = {
//    'Reminder':
//        'Reminder : We’re excited to launch a new feature on our platform that will revolutionize your Facebook marketing and triple your ROI. Visit url.com to learn more',
//    'New Message':
//        'New Message: We’re excited to launch a new feature on our platform that will revolutionize your Facebook marketing and triple your ROI. Visit url.com to learn more',
//    'Connecting Again':
//        'Connecting Again : We’re excited to launch a new feature on our platform that will revolutionize your Facebook marketing and triple your ROI. Visit url.com to learn more',
//  };

  List<String> getKeys(){
    List<String> smsKeys = new List();
    for ( var key in _SMSTemplate.keys)
      smsKeys.add(key);
    return smsKeys;
  }

  String getValuePerKey(String key){
    return _SMSTemplate['${key}'];
  }


}

PS 我看过一些帖子,但因为我是 Flutter 新手,所以我完全被打倒了。

有没有更简单的方法可以做到这一点。

谢谢,

将显示来自 http 调用的内容的小部件

   var templateMessagesDropDown = new DropdownButton<String>(
      onChanged: (String newValue) {
        setState(() {
          templateMsgKey = newValue;
          print("Selcted : ${templateMsgKey.toString()} ");
        });
      },
      // value: _defaultTemplateValue,
      style: textStyle,
      //elevation: 1,
      hint: Text("Please choose a template"),
      isExpanded: true,
      //
      items: smsEngine.getKeys().map<DropdownMenuItem<String>>((String value) {
        return DropdownMenuItem<String>(
          value: value,
          child: Text(value),
        );
      }).toList(),
    );

标签: dartflutterdart-webui

解决方案


我想知道如何最好地将这个 Future 转换为 List

Future<List<TemplateInfoModel>> fetchTemplates()应该返回您期望的列表。您可能需要考虑使用 FutureBuilder 或 StreamBuilder 来更新屏幕上的 UI 元素。或者,如果您不喜欢使用其中任何一个,您可以调用 Future 并更新当前屏幕上的列表。

List<TemplateInfoModel> _listTemplateInfoModel = [];
...

fetchTemplates().then((value){
  setState((){
    _listTemplateInfoModel = value;
  });
});


推荐阅读