Flutter獲取遠程數據 刷新UI界面

import 'package:flutter/material.dart'; import 'package:http/http.dart' as http; void main() => runApp(MyApp()); class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { // TODO: implement build //須要構建一個material的部件
    return MaterialApp( title: '獲取遠程數據並解析爲模型', home: MyPage(), ); } } class MyPage extends StatefulWidget { //必須重寫該方法 返回state
 @override State<StatefulWidget> createState() { // TODO: implement createState
    return MyState(); } } class MyState extends State<MyPage> { String ddddd = "ffffffff"; // @override // void setState(fn) { //    // TODO: implement setState // super.setState(fn); //
// } //必須重寫build方法 - 返回一個部件
 @override Widget build(BuildContext context) { // TODO: implement build

    return Scaffold( appBar: AppBar( title: Text('數據轉模型'), ), body: Column( children: <Widget>[ Container( child: GestureDetector( child: Text(ddddd), // onTap: fetchPost, //刷新界面 // onTap: fetchPost, //這裏須要的是一個方法, 而不是一個方法的返回值
 onTap: (){ fetchPost().then((value){ setState(() { ddddd = value; }); }); }, )) ], ), ); } } //返回String, 顯示到text文本部件上 //調用接口 獲取服務端數據
Future<String> fetchPost() async { final response = await http.get("https://wanandroid.com/wxarticle/chapters/json"); final result = response.body; print(result); return result; }

一個簡單的demo