zoukankan      html  css  js  c++  java
  • 18-Flutter移动电商实战-首页_火爆专区商品接口制作

    1、获取接口的方法

    在service/service_method.dart里制作方法。我们先不接收参数,先把接口调通。

    Future getHomePageBeloConten() async{

      try{
        print('开始获取下拉列表数据.................');
        Response response;
        Dio dio = new Dio();
        dio.options.contentType=ContentType.parse("application/x-www-form-urlencoded");
        int page=1;
        response = await dio.post(servicePath['homePageBelowConten'],data:page);
        if(response.statusCode==200){
          return response.data;
        }else{
          throw Exception('后端接口出现异常,请检测代码和服务器情况.........');
        }
      }catch(e){
          return print('ERROR:======>${e}');
      }

    }

    简单说一下 Future,在我们平时开发中我们是这样用的,首先给我们的函数后面加上 async 关键字,表示异步操作,然后函数返回值写成 Future,然后我们可以 new 一个 Future,逻辑前面加上一个 await关键字,然后可以使用future.then 等操作。

    2、进行调试接口

    接口对接的方法写好了,然后我们进行测试一下接口是否可以读出数据,如果能读出数据,就说明接口已经调通,我们就可以搞事情了。

    因为这个新的类是由下拉刷新的,也就是动态的类,所以需要使用StatefulWidget。

    代码如下:

    class HotGoods extends StatefulWidget {
      _HotGoodsState createState() => _HotGoodsState();
    }

    class _HotGoodsState extends State<HotGoods{


       void initState() 
         super.initState();
          getHomePageBeloConten().then((val){
             print(val);
          });
       }

      @override
      Widget build(BuildContext context) {
        return Container(
           child:Text('1111'),
        );
      }
    }

    3、精简代码,来个通用接口

    在写service_method.dart的时候,你会发现我们大部分的代码都是相同的,甚至复制一个方法后,通过简单的修改几个地方,就可以使用了。那就说明这个地方由优化的必要。让代码更通用更精简。

    精简代码如下:

    Future request(url,formData)async{
        try{
          print('开始获取数据...............');
          Response response;
          Dio dio = new Dio();
          dio.options.contentType=ContentType.parse("application/x-www-form-urlencoded");
          if(formData==null){
              response = await dio.post(servicePath[url]);
          }else{
              response = await dio.post(servicePath[url],data:formData);
          }
          if(response.statusCode==200){
            return response.data;
          }else{
              throw Exception('后端接口出现异常,请检测代码和服务器情况.........');
          }
        }catch(e){
            return print('ERROR:======>${e}');
        }

    }

    使用也是非常简单的,只要传递一个接口名称和相对参数就可以了。

    request('homePageBelowConten',1).then((val){
        print(val);
    });
  • 相关阅读:
    简述虚拟打印功能的实现方法。
    什么是spool系统,什么是预输入,什么是缓输出?
    什么是虚拟设备技术,什么是虚拟设备,如何进行虚拟设备分配?
    什么是共享设备,对共享设备如何分配?
    什么是独占设备,对独占设备如何分配?
    对I/O设备分配的一般策略是什么?
    maven+nexus setting.xml配置(收藏)
    MySQL自动化安装(双主多从读写分离)
    Shell常用操作
    shell中的比较语句
  • 原文地址:https://www.cnblogs.com/niceyoo/p/11055811.html
Copyright © 2011-2022 走看看