下面是一个简单的 Flutter 代码演示,展示了如何使用 Future 和 await 从网络请求中获取数据:
import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
String _data = "";
Future<String> fetchData() async {
var result = await http.get(Uri.parse("https://jsonplaceholder.typicode.com/todos/1"));
return json.decode(result.body)['title'];
}
@override
void initState() {
super.initState();
fetchData().then((value) {
setState(() {
_data = value;
});
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("Flutter Future & Await Demo"),
),
body: Center(
child: Text(_data),
),
);
}
}
在这个例子中,fetchData() 方法使用了 async 和 await 关键字。它发送了一个 GET 请求到 https://jsonplaceholder.typicode.com/todos/1,然后等待从服务器返回响应数据。然后它将响应数据转换成 JSON 格式,然后返回其中的 title 字段。
在 initState() 方法中,我们使用 .then() 方法来处理 fetchData() 返回的 Future。当数据返回时,我们将其设置给 _data 变量并调用 setState() 方法,从而更新 UI。最终,我们在 body 中展示从服务器接收到的数据。