Flutter实战视频-移动电商-41.详细页_数据接口的调试
41.详细页_数据接口的调试
建立数据模型层,我们的业务逻辑分开,然后进行后台数据的调试
生成model类
json数据:
{
"code": "",
"message": "success",
"data": {
"goodInfo": {
"image5": "",
"amount": ,
"image3": "",
"image4": "",
"goodsId": "ed675dda49e0445fa769f3d8020ab5e9",
"isOnline": "yes",
"image1": "http://images.baixingliangfan.cn/shopGoodsImg/20190116/20190116162618_2924.jpg",
"image2": "",
"goodsSerialNumber": "",
"oriPrice": 3.00,
"presentPrice": 2.70,
"comPic": "http://images.baixingliangfan.cn/compressedPic/20190116162618_2924.jpg",
"state": ,
"shopId": "402880e860166f3c0160167897d60002",
"goodsName": "可口可乐500ml/瓶",
"goodsDetail": "<img src=\"http://images.baixingliangfan.cn/shopGoodsDetailImg/20171224/20171224081109_5060.jpg\" width=\"100%\" height=\"auto\" alt=\"\" /><img src=\"http://images.baixingliangfan.cn/shopGoodsDetailImg/20171224/20171224081109_1063.jpg\" width=\"100%\" height=\"auto\" alt=\"\" /><img src=\"http://images.baixingliangfan.cn/shopGoodsDetailImg/20171224/20171224081110_8029.jpg\" width=\"100%\" height=\"auto\" alt=\"\" /><img src=\"http://images.baixingliangfan.cn/shopGoodsDetailImg/20171224/20171224081110_1074.jpg\" width=\"100%\" height=\"auto\" alt=\"\" /><img src=\"http://images.baixingliangfan.cn/shopGoodsDetailImg/20171224/20171224081110_8439.jpg\" width=\"100%\" height=\"auto\" alt=\"\" /><img src=\"http://images.baixingliangfan.cn/shopGoodsDetailImg/20171224/20171224081110_6800.jpg\" width=\"100%\" height=\"auto\" alt=\"\" />"
},
"goodComments": [
{
"SCORE": ,
"comments": "果断卸载,2.5个小时才送到",
"userName": "157******27",
"discussTime":
}
],
"advertesPicture": {
"PICTURE_ADDRESS": "http://images.baixingliangfan.cn/advertesPicture/20190113/20190113134955_5825.jpg",
"TO_PLACE": ""
}
}
}
json生成dart类的网址:
https://javiercbk.github.io/json_to_dart/
在models文件夹下面新建details.dart类,并把我们生成的类复制过来。
生成的类需要稍微修改一下,类名修改为DetailsGoodsModel
里面的Data数据修改为DatailsGoodsData
设置后台的URL
'getGoodDetailById':serviceUrl+'wxmini/getGoodDetailById',//商品详细信息
Provide
provide/新建details_info.dart
我们的业务逻辑要写在provide里面。
所以需要引入:../service/service_method.dart
引入四个必要的包,然后class类要混入,。ChangeNotifier
UI和业务逻辑分开,所以获取数据我们就写在Provide里面
后台获取数据的方法就写完了。
provide全局注入
在main.dart中注入
UI调用
新写一个方法,看看后台有没有数据,打印到控制台就可以了。
build方法内调用
运行测试
点击后报了一个错误
Unhandled Exception: type 'double' is not a subtype of type 'int'
修正错误
保存后,大R进行热加载,成功的返回了数据
Flutter实战视频-移动电商-41.详细页_数据接口的调试的更多相关文章
- Flutter实战视频-移动电商-43.详细页_补充首页跳转到详细页
43.详细页_补充首页跳转到详细页 首页轮播点击到详细页 修改我们轮播这里的代码:SwiperDiy这个类这里的代码 return InkWell( onTap: (){ Application.ro ...
- Flutter实战视频-移动电商-44.详细页_首屏自定义Widget编写
44.详细页_首屏自定义Widget编写 把详细页的图片.标题.编号和价格形成一个单独的widget去引用 详情页的顶部单独封装个插件 在pages下面新建detials_page的文件件并在里面新建 ...
- Flutter实战视频-移动电商-45.详细页_说明区域UI编写
45.详细页_说明区域UI编写 pages/details_page/details_expain.dart 详情页面引用组件 效果展示: 最终代码: import 'package:flutter/ ...
- Flutter实战视频-移动电商-46.详细页_自定义TabBar Widget
46.详细页_自定义TabBar Widget 主要实现详情和评论的tab provide定义变量 自己做一个tab然后用provide去控制 定义两个变量来判断是左侧选中了还是右侧选中了.并定义一个 ...
- Flutter实战视频-移动电商-48.详细页_详情和评论的切换
48.详细页_详情和评论的切换 增加切换的效果,我们主要是修改这个地方 这样我们的评论的内容就显示出来了 最终代码 details_web.dart import 'package:flutter/m ...
- Flutter实战视频-移动电商-47.详细页_Flutter_html插件的使用
47.详细页_Flutter_html插件的使用 详情里面是hemlt和图片组成的,但是flutter是不支持html的所以需要其他插件 flutter webview plugin:这个不太好用 f ...
- Flutter实战视频-移动电商-42.详细页_UI主页面架构搭建
42.详细页_UI主页面架构搭建 详细分成六大部分拆分开 body里面用FutureBuilder异步加载. FutureBuilder里面的furure属性这里用一个方法,必须返回的也是future ...
- Flutter实战视频-移动电商-49.详细页_Stack制作底部工具栏
49.详细页_Stack制作底部工具栏 一直悬浮在最下面的 Stack层叠组件.里面用Row 可以横向布局 开始 stack如果想定位就要用position去定位. 修改return返回值的这个地方 ...
- Flutter实战视频-移动电商-34.列表页_小BUG的修复
34.列表页_小BUG的修复 当高粱酒的子类没有数据返回的时候就会报错. 解决接口空数据报错的问题 没有数据的时候,给用户一个友好的提示, 我们没有数据的时候还要告诉用户,提示一下他没有数据,在我们的 ...
随机推荐
- 笔记04 WPF对象引用
转自:http://www.fx114.net/qa-261-90254.aspx 我们应该都知道,XAML是一种声明式语言,XAML的标签声明的就是对象.一个XAML标签会对应着一个对象,这个对象一 ...
- JS实现搜索模糊匹配
Js代码 <script type="text/javascript"> var websites = [["1231","账上1&q ...
- Ubuntu14下Hadoop开发<2> 编译64位Hadoop2.4
Hadoop官方站点仅仅提供了32位的Hadoop包.我装的是64位的系统.自然无法使用,会报错误,导致的结果是无法启动hadoop libhadoop.so.1.0.0 which might ha ...
- kubernetes集群管理命令(三)
系列目录 前面两节我们由浅入深介绍了不少kubernetes管理比较常用的命令.本节我们通过案例讲解一些需要更为复杂的操作才能完成的命令. 选择一个deployment下的所有pod 前面讲到过,ku ...
- 初识代码封装工具SWIG(回调Python函数)
这不是我最早使用swig了,之前在写Kynetix的时候就使用了swig为python封装了C语言写的扩展模块.但是当时我对C++还不是很了解,对其中的一些概念也只是拿来直接用,没有理解到底是什么,为 ...
- 如何分析和提高大型项目(C/C++)的编译速度?(VS2015特有的:/LTCG:incremental选项)
常见的有几个:1. Precompile header2. 多线程编译3. 分布式编译4. 改code,减少依赖性 另外还有一个VS2015特有的:/LTCG:incremental选项.以前为了执行 ...
- MongoDB 学习一
这一章,我们先介绍几个MongoDB的概念: 1.document: 它是MongoDB的基础数据单元,它大概等价于关系型数据库中的行. 2.collection: 可以想象成动态的表. 3.一个简单 ...
- java内存泄露具体解释
非常多人有疑问,java有非常好的垃圾回收机制,怎么会有内存泄露?事实上是有的,那么何为内存泄露?在Java中所谓内存泄露就是指在程序执行的过程中产生了一些对象,当不须要这些对象时,他们却没有被垃圾回 ...
- Impala 安装笔记2一hive和mysql安装
l 安装hive,hive-metastore hive-server $ sudo yum install hive hive-metastore hive-server l 安装mysql ...
- php命名空间使用总结
从php5.3开始可以使用命名空间,命名空间是为了防止命名 空间的元素重复而使用的.命名空间的元素包括:class.function.const(从php5.3开始在类外部也可以用const定义常量, ...