Flutter移动电商实战 --(18)首页_火爆专区商品接口制作
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);
});
.
Flutter移动电商实战 --(18)首页_火爆专区商品接口制作的更多相关文章
- Flutter移动电商实战 --(19)首页_火爆专区商品接口制作
Dart中可选参数的设置 上节课在作通用方法的时候,我们的参数使用了一个必选参数,其实我们可以使用一个可选参数.Dart中的可选参数,直接使用“{}”(大括号)就可以了.可选参数在调用的时候必须使用p ...
- 18-Flutter移动电商实战-首页_火爆专区商品接口制作
1.获取接口的方法 在service/service_method.dart里制作方法.我们先不接收参数,先把接口调通. Future getHomePageBeloConten() async{ ...
- Flutter实战视频-移动电商-18.首页_火爆专区后台接口调试
18.首页_火爆专区后台接口调试 楼层结束之后有个火爆专区.到地图有个上拉加载的效果 lib/config/service_url.dart 首先找到我们的接口配置文件,增加接口的配置 lib/ser ...
- Flutter实战视频-移动电商-19.首页_火爆专区界面布局编写
19.首页_火爆专区界面布局编写 看一下图片的效果 一个标题栏,下面是多行两列.里面可以用column布局,外面用Warp流式布局 有得小伙伴说这里可以用网格布局,网格布局的话还是有一定的效率问题.这 ...
- Flutter实战视频-移动电商-20.首页_火爆专区上拉加载效果
20.首页_火爆专区上拉加载效果 上拉加载的插件比较都.没有一个一枝独秀的 可以自定义酷炫的header和footer 一直在更新 推荐使用这个插件: https://github.com/xuelo ...
- Flutter移动电商实战 --(30)列表页_商品列表UI界面布局
小程序里面的布局方式 小程序的图片上这里使用的是warp布局,因为首页里面火爆专区,已经用过了warp来布局了. 所以这里我们没有必要再讲一遍,这里我们使用ListView,我们把它布局成下图这种形式 ...
- Flutter移动电商实战 --(43)详细页_补充首页跳转到详细页
首页轮播点击到详细页 修改我们轮播这里的代码:SwiperDiy这个类这里的代码 return InkWell( onTap: (){ Application.router.navigateTo(co ...
- Flutter实战视频-移动电商-33.列表页_子类和商品列表交互效果
33.列表页_子类和商品列表交互效果 主要实现点击小类下面的列表跟着切换 获取右侧下面的列表信息,即要传递大类的id也要传递小类的,所以需要把左侧的大类的id也要Provide化 可以看下网站上的接口 ...
- Flutter移动电商实战 --(21)分类页_类别信息接口调试
先解决一个坑 取消上面的GridVIew的回弹效果.就是在拖这个gridview的时候有一个滚动的效果 physics: NeverScrollableScrollPhysics(), 大R刷新后,点 ...
随机推荐
- Python 多进程编程
import multiprocessing import time import os import random g_nums = [11, 22, 33] def test1(): while ...
- Flutter自定义绘制(1)- 绘制基础
CustomPainter Flutter 中实现绘制的主要是CustomPainter类. 我们一般继承这个类,来使用它: class MyPainter extends CustomPainter ...
- SAP Cloud Platform上Destination属性为odata_gen的具体用途
今天工作发现,SAP Cloud Platform上创建Destination维护的WebIDEUsage属性很有讲究: 帮助文档:https://help.sap.com/viewer/825270 ...
- 5.创建执行线程的方式之三 :实现Callable 接口
Callable 接口 一.Java 5.0 在 java.util.concurrent 提供了 一个新的创建执行线程的方式(之前有继承Thread 和 实现Runnable):Callable 接 ...
- 2.数码相框-编码(ASCII/GB2312/Unicode)介绍
转载:https://www.cnblogs.com/lifexy/p/8485634.html 在上章-学习了数码相框的框架分析(1)了 本章主要内容如下: 1)熟悉ASCII/GB2312/Uni ...
- Vue 将一个组件嵌入到另一个组件中
https://github.com/JasmineQian/Vue_Sample App.vue是所有组件的 要嵌入到App.vue组件中, 在script处导入 import xxx from ...
- Java基础 继承的方式创建多线程 / 线程模拟模拟火车站开启三个窗口售票
继承的方式创建多线程 笔记: /**继承的方式创建多线程 * 线程的创建方法: * 1.创建一个继承于Thread 的子类 * 2.重写Thread类的run()方法 ,方法内实现此子线程 要完成的功 ...
- 前端笔记-html
前端笔记html 前端三大利器,html(本源),css(着装),js(动作) html 学习html就是学习一套规则能够被浏览器识别,在页面中展示,一个页面只能运行一个html 标签 <> ...
- Android-File读写+SharedPreferences的存取地址
写了两个demo,一个是使用SharedPreferences将数据存储在应用文件中并读取,另一个是使用Context的openFileOutput和openFileInput将数据存储在应用文件中并 ...
- Java核心技术 卷一 复习笔记(丁
面向对象1.面向对象设计概述 1.1.面向对象是什么 面向对象是一种程序设计范型(简称OOP),是针对对象进行开发,简化开发过程的一种设计方式 1.2.类 类是构造对象的模板,相当于一个烘焙模板,而对 ...