Flutter--網絡請求（一）利用Dart原生http實現

Json字符串和Map類型轉換

import 'dart:convert'
// Json轉Map
Json.decode(strData)
// Map轉Json
Map userInfo = {"username": "wjx", "age": 22};
print(json.encode(userInfo));

使用Dart原生http實現網絡請求實例

• 首先在pubspec.yaml中導入依賴

dependencies:
...
  http: ^0.12.0+2

import 'dart:convert'; // 引入json和map轉換庫
import 'package:flutter/material.dart';
import 'package:http/http.dart' as http; // 導入dart http請求庫


class HttpPage extends StatefulWidget {
  HttpPage({Key key}) : super(key: key);


  _HttpPageState createState() => _HttpPageState();
}


class _HttpPageState extends State<HttpPage> {
  List list = [];


  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    _getData();
    Map userInfo = {"username": "wjx", "age": 22};
    print(json.encode(userInfo));
  }


  // 請求數據
  _getData() async {
    var apiUrl = "https://www.wanandroid.com/article/list/1/json";
    var result = await http.get(apiUrl);
    if (result.statusCode == 200) {
      print(json.decode(result.body)["data"]["datas"]);
      setState(() {
        list = json.decode(result.body)["data"]["datas"];
      });
    } else {
      print(result.statusCode);
    }
  }


  // 提交數據
  _postData() async {
    var apiUrl = "https://www.wanandroid.com/user/login";
    var result = await http
        .post(apiUrl, body: {'username': "wjxbless", 'password': "********"});
    if (result.statusCode == 200) {
      print(json.decode(result.body));
    } else {
      print(result.statusCode);
    }
  }


  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      appBar: AppBar(
        title: Text("請求數據"),
      ),
      body: list.length>0? ListView(
          children: list.map((value){
            return ListTile(
              title: Text(value["title"]),
            );
          }).toList(),
        ) : Text("加載中...")
    );
  }
}