Flutter 网络请求 Dio

Json 与 Map 的转化

把map数据转换成Json字符串

json.encode(mapData);

把json字符串转换成map数据

json.decode(jsonStr);

---

数据的请求

• 初始化的数据应该在 initState() 中执行
• 如果在build中请求数据,数据完成后调用 setState()方法, setState()回调build(),造成死循环并一直请求数据
• 请求回来的数据,应该更关心与界面绑定的数据及其集合的引用,而不应过度关注具体指向的类型,从而规避类型转换异常问题

示例

• Dio文档

import 'package:dio/dio.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class HttpAct extends StatefulWidget {
  @override
  _HttpActState createState() => _HttpActState();
}

class _HttpActState extends State<HttpAct> {
  List listData = [];

  @override
  void initState() {
    // TODO: implement initState
    super.initState();

    _getHttp();
  }

  @override
  Widget build(BuildContext context) {

    return Scaffold(
      appBar: AppBar(
        centerTitle: true,
        title: Text("网络请求界面"),
      ),
      body: listData.length > 0
          ? ListView.builder(
          itemCount: listData.length,
          itemBuilder: (BuildContext context, int index) {
              return ListTile(
                title: Text("${listData[index]["title"]}"),
              );
            })
          : Text("暂无数据"),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          //返回上一页
          Navigator.of(context).pop();
        },
        child: Text("返回"),
      ),
    );
  }

  void _getHttp() async {
    try {
      var response = await Dio().get('https://jd.itying.com/api/pcate');

      print(response is Map);

      var code = response.statusCode;

      //dio会将数据response.data中的数据转换为map类型
      var data = response.data;

      print("响应状态码: $code 响应数据: $data");

      //获取到的新数据列表  我们无需知道数据的具体列表,交给系统做自动转化
      var newList = data["result"];

      if(code == 200){
        setState(() {
          this.listData.addAll(newList);
          print("最新的数据值: ${this.listData}");
        });
      }else{
        print("数据请求异常");
      }
    } catch (e) {
      print(e);
    }
  }
}