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.详细页_数据接口的调试的更多相关文章

  1. Flutter实战视频-移动电商-43.详细页_补充首页跳转到详细页

    43.详细页_补充首页跳转到详细页 首页轮播点击到详细页 修改我们轮播这里的代码:SwiperDiy这个类这里的代码 return InkWell( onTap: (){ Application.ro ...

  2. Flutter实战视频-移动电商-44.详细页_首屏自定义Widget编写

    44.详细页_首屏自定义Widget编写 把详细页的图片.标题.编号和价格形成一个单独的widget去引用 详情页的顶部单独封装个插件 在pages下面新建detials_page的文件件并在里面新建 ...

  3. Flutter实战视频-移动电商-45.详细页_说明区域UI编写

    45.详细页_说明区域UI编写 pages/details_page/details_expain.dart 详情页面引用组件 效果展示: 最终代码: import 'package:flutter/ ...

  4. Flutter实战视频-移动电商-46.详细页_自定义TabBar Widget

    46.详细页_自定义TabBar Widget 主要实现详情和评论的tab provide定义变量 自己做一个tab然后用provide去控制 定义两个变量来判断是左侧选中了还是右侧选中了.并定义一个 ...

  5. Flutter实战视频-移动电商-48.详细页_详情和评论的切换

    48.详细页_详情和评论的切换 增加切换的效果,我们主要是修改这个地方 这样我们的评论的内容就显示出来了 最终代码 details_web.dart import 'package:flutter/m ...

  6. Flutter实战视频-移动电商-47.详细页_Flutter_html插件的使用

    47.详细页_Flutter_html插件的使用 详情里面是hemlt和图片组成的,但是flutter是不支持html的所以需要其他插件 flutter webview plugin:这个不太好用 f ...

  7. Flutter实战视频-移动电商-42.详细页_UI主页面架构搭建

    42.详细页_UI主页面架构搭建 详细分成六大部分拆分开 body里面用FutureBuilder异步加载. FutureBuilder里面的furure属性这里用一个方法,必须返回的也是future ...

  8. Flutter实战视频-移动电商-49.详细页_Stack制作底部工具栏

    49.详细页_Stack制作底部工具栏 一直悬浮在最下面的 Stack层叠组件.里面用Row 可以横向布局 开始 stack如果想定位就要用position去定位. 修改return返回值的这个地方 ...

  9. Flutter实战视频-移动电商-34.列表页_小BUG的修复

    34.列表页_小BUG的修复 当高粱酒的子类没有数据返回的时候就会报错. 解决接口空数据报错的问题 没有数据的时候,给用户一个友好的提示, 我们没有数据的时候还要告诉用户,提示一下他没有数据,在我们的 ...

随机推荐

  1. web前端面试系列 一 js闭包

    一.什么是闭包? JavaScript高级程序设计第三版: 闭包是指有权访问另一个函数作用域中的变量的函数. 在js中定义在函数内部的子函数能够访问外部函数定义的变量,因此js内部函数就是一个闭包. ...

  2. 升级iOS8和iOS9系统后,保险箱Pro、私人保险箱、私密相冊打开就闪退的官方解决方式

    升级iOS8和iOS9.iOS10系统后,保险箱Pro.私人保险箱.私密相冊打开就闪退的官方解决方式 查看设备iOS操作系统版本号号办法:iPhone/iPad->设置->通用->关 ...

  3. qt-mingw530-opencv-开发配置

    1.安装好Qt和Qtcreator 2.解压OpenCV源码到一个目录下.路径不能带空格和中文. 3.把E:\Qt\qtcreator-2.1.0\mingw\bin添加到系统环境变量中. 4.安装C ...

  4. sublime 快捷键 汇总--长期

    Ctrl+P 输入当前项目中的文件名,快速搜索文件 Ctrl+G 输入数字跳转到该行代码 Ctrl+R 输入关键字,查找文件中的函数名 Ctrl+: 输入关键字,查找文件中的变量名.属性名等 Ctrl ...

  5. 文件共享和使用 dup 函数创建新描述符的区别

    前言 文件共享是指同时打开一个文件 用 dup 函数能对指定文件描述符再创建一个新的描述符,且这个新的描述符和旧的描述符指向的是同一个文件. 这两种行为有什么区别呢?下面给出的两张文件系统的图形象的解 ...

  6. [听听音乐]X-Ray Dog

    X-Ray Dog是一个专门为好莱坞电影预告配乐的音乐工作室. https://music.163.com/#/artist?id=105618 有空的时候听听.

  7. iOS进程间通信之CFMessagePort

    本文转载至 http://www.cocoachina.com/industry/20140606/8701.html iOS系统是出了名的封闭,每个应用的活动范围被严格地限制在各自的沙盒中.尽管如此 ...

  8. [Cocoa]深入浅出Cocoa之Bonjour网络编程

    本文转载至 http://www.cnblogs.com/kesalin/archive/2011/09/15/cocoa_bonjour.html   深入浅出Cocoa之Bonjour网络编程 罗 ...

  9. SpringSecurity加密Salt

    Spring Security 加密,默认加salt的输出为:password{salt};然后再对这个加salt后的密码加密存储. 源码如下: protected String mergePassw ...

  10. 激活win10企业长期服务版

    win10 2016 长期服务版的ISO文件中本身就带有KMS激活KEY,不用输入任何KEY,连接网络进入CMD,只要输入:slmgr /skms kms.digiboy.irslmgr /ato这两 ...