鸿蒙HarmonyOS 网络请求获取数据Http

 注意的是;要为接口返回值指定类型 ,以及定义接口数据类型

 index.ets

import { http } from '@kit.NetworkKit';

interface createAtType {
  date: number,

}

interface dataListType {
  createAt: createAtType;
  imgUrl: ''
}

@Component
export default struct TabBar {
  @State dataList: dataListType[] = []
    
    aboutToAppear() {
    console.log(`我是组件钩子函数:aboutToAppear`)
    let http1 = http.createHttp();

    let responseResult = http1.request('https://www.grosup.com/banner/getall/0', {
      method: http.RequestMethod.GET,
      header: {
        'Content-Type': 'application/json'
      },
      readTimeout: 20000,
      connectTimeout: 10000
    });
    let serverData: ResponseResult = new ResponseResult();
    responseResult.then((value: http.HttpResponse) => {

      let res = JSON.stringify(value)

      let result = `${value.result}`;
      let resCode = `${value.code}`
      console.log('result1', result)

      let resultObj: object = JSON.parse(result) //一定要指定类型,不然无法获取属性
      console.log('result2', JSON.stringify(resultObj['data']['list'])) //
      this.dataList = resultObj['data']['list']
    }).catch(() => {
    })


  
  }


 build {
         Column() {

            Text('测试网络')

            // Text(JSON.stringify(this.dataList))
           ForEach(this.dataList, (item: dataListType) => {
              GridItem() {
                Column() {
                  Image(item.imgUrl)
                    .objectFit(ImageFit.Cover)
                    .width('100%')
                    .height('200')
                  // Text(item.createAt?.date)
                  Text(item.imgUrl)
                }
              }.onClick(() => {

              })
            }, (item: dataListType, index: number) => `${item}_${index}`)



          }

    }
  
}

定义接口类型使用interface和class的区别

建议使用class接收接口数据,因为interface不能逻辑复用与封装,直接使用又容易出现类型安全问题而导致APP闪退

很多人讲,请求接口数据要为每个接口特地写一个类很麻烦,这里用一个示例聊聊不使用类与使用类的区别。

import { plainToClass } from 'class-transformer'

class Ohter {
  dateofBirth: string = ""
}

class User {
  name: string = ""
  ohter?: Ohter

  getAge() {
    if(!this.ohter){
      return '数据异常'
    }
    const today = new Date();
    const birthDate = new Date(this.ohter.dateofBirth);
    let age = today.getFullYear() - birthDate.getFullYear();
    return age;
  }
}

@Entry
@Component
struct Page043 {
  userJson: string = `{ "name":"张三","ohter":{"dateofBirth":"2000-01-01"}}`
  userJson_2: string = `{ "name":"李四" }`

  build() {
    Column() {
      Button('测试').onClick(() => {
        //方案一:直接使用JSON.parse+[]  ,服务端数据正常时
        const today = new Date();
        const birthDate = new Date(JSON.parse(this.userJson)['ohter']['dateofBirth']);
        let age = today.getFullYear() - birthDate.getFullYear();

        console.info(`姓名:${JSON.parse(this.userJson)['name']}`)
        console.info(`年龄:${age}`)
      })
      Button('测试2').onClick(() => {
        //方案二:将数据处理封装到class内
        let users: User = plainToClass(User, JSON.parse(this.userJson))
        console.info(`姓名:${users.name}`)
        console.info(`年龄:${users.getAge()}`)
      })
      Button('测试3').onClick(() => {
        //方案三:直接使用JSON.parse+[] ,服务端数据异常时,闪退
        const today = new Date();
        const birthDate = new Date(JSON.parse(this.userJson_2)['ohter']['dateofBirth']);
        let age = today.getFullYear() - birthDate.getFullYear();

        console.info(`姓名:${JSON.parse(this.userJson)['name']}`)
        console.info(`年龄:${age}`)

      })
      Button('测试4').onClick(() => {
        //方案四:将数据处理封装到class内 ,服务端数据异常时
        let users: User = plainToClass(User, JSON.parse(this.userJson_2))
        console.info(`姓名:${users.name}`)
        console.info(`年龄:${users.getAge()}`)

      })
    }
    .width('100%')
    .height('100%')
  }
}

总结:

方案一没使用任何框架,也不需要为接口写类, [] 就能拿到数据,拿到后,需要自己获取一下年,做减法,才能知道这个人的真实年龄。这是最正常的写法。

方案二相比方案一,体验了封装class的好处,可以把复杂的逻辑封装到class内,而不必把一堆逻辑代码暴露在page内。

方案三体现了方案一的缺点,万一接口数据给的不正常,方案一这种很容易拿不到数据,导致app崩溃

方案四体现了class的另一个好处,就是可以在内部事先加判断,避免接口数据不正确而导致app崩溃

【总结】使用class的好处是

1、代码可读性和维护性提升:可以对属性添加注释、使得开发者能够更容易理解数据的组成和用途,这对于团队协作和长期维护是非常有利的。

2、类型安全:通过类的定义提前预防这类错误,而不是在运行时遭遇异常或“闪退”。

3、逻辑复用与封装:数据处理逻辑被集中在一处,便于修改和复用。

4、易于扩展和继承:类支持继承,允许你基于现有类创建更具体的子类,轻松添加或覆盖功能。这为软件的未来扩展提供了便利。

5、错误处理更加优雅:提高了应用的健壮性。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/916014.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Windows VSCode .NET CORE WebAPI Debug配置

1.安装C#插件 全名C# for Visual Studio Code,选择微软的 2. 安装C# Dev Kit插件 全名C# Dev Kit for Visual Studio Code,同样是选择微软的 3.安装Debugger for Unity 4.配置launch.json 文件 {"version": "0.2.0","config…

Odoo:免费开源的流程制造行业ERP管理系统

概述 聚焦流程制造连续性生产的特性,提供集成PLMERPMESBI的一体化解决方案,涵盖计划、生产、质量、配方、供销、库存、成本、设备、资金管理等业务领域的整体性解决方案 行业的最新洞察&行业典型痛点 一、生产过程需要精细化控制 需要在各种制约…

ERP管理系统(源码+文档+部署+讲解)

本文将深入解析“ERP管理系统”的项目,探究其架构、功能以及技术栈,并分享获取完整源码的途径。 系统概述 ERP管理系统是一款全面的资源规划软件,旨在通过集成各种业务流程和功能模块来提高管理效率和决策质量。该系统覆盖了从基础设置、供…

mysql每日一题(上升的温度,date数据的计算)

日期之间的运算 日期类型的加法运算 data_add(now_data,interval 1 month) select date_add(now(), interval 1 day); -- 加1天 select date_add(now(), interval 1 hour); -- 加1小时 select date_add(now(), interval 1 minute); -- 加1分钟 select date_add(now(), inter…

CTF攻防世界小白刷题自学笔记13

1.fileinclude,难度:1,方向:Web 题目来源:宜兴网信办 题目描述:无 给一下题目链接:攻防世界Web方向新手模式第16题。 打开一看给了很多提示,什么language在index.php的第九行,flag在flag.php中,但事情显…

FFmpeg 4.3 音视频-多路H265监控录放C++开发十三.2:avpacket中包含多个 NALU如何解析头部分析

前提: 注意的是:我们这里是从avframe转换成avpacket 后,从avpacket中查看NALU。 在实际开发中,我们有可能是从摄像头中拿到 RGB 或者 PCM,然后将pcm打包成avframe,然后将avframe转换成avpacket&#xff0…

LabVIEW环境监测系统

随着环境问题的日益严重,环境参数的实时监测成为保障公共健康和生态平衡的重要手段。开发了一款基于LabVIEW开发的环境监测系统,能够对大气中的温度、湿度及二氧化硫浓度进行实时监测,并提供数据存储和超阈值报警功能。 系统组成 本系统由下…

【视觉SLAM】2-三维空间刚体运动的数学表示

读书笔记:学习空间变换的三种数学表达形式。 文章目录 1. 旋转矩阵1.1 向量运算1.2 坐标系空间变换1.3 变换矩阵与齐次坐标 2. 旋转向量和欧拉角2.1 旋转向量2.2 欧拉角 3. 四元数 1. 旋转矩阵 1.1 向量运算 对于三维空间中的两个向量 a , b ∈ R 3 a,b \in \R^3 …

SystemVerilog学习笔记(十):进程/细粒度进程控制

进程 进程或线程是作为独立实体执行的任何代码片段。fork-join块创建并行运行的不同线程。在下面的图-1中,可以看到进程的类型和进程控制。 序号进程描述1.fork-join只有所有子线程执行完毕时,父线程才会执行。2.fork-join_any只有任何一个子线程执行完…

【Visual Studio系列教程】如何在 VS 上编程?

上一篇博客中,我们介绍了《什么是 Visual Studio?》。本文,我们来看第2篇《如何在 VS 上编程?》。阅读本文大约10 分钟。我们会向文件中添加代码,了解 Visual Studio 编写、导航和了解代码的简便方法。 本文假定&…

【3D Slicer】的小白入门使用指南八

3D Slicer DMRI(Diffusion MRI)-扩散磁共振认识和使用 0、简介 大脑解剖 ● 白质约占大脑的 45% ● 有髓神经纤维(大约10微米轴突直径) 白质探索 朱尔斯约瑟夫德杰林(Jules Joseph Dejerine,《神经中心解剖学》(巴黎,1890-1901):基于髓磷脂染色标本的神经解剖图谱)…

GraphPad Prism与鹰谷电子实验记录本强强联合,数据兼容互通

在科研探索的征途上,每一次数据的记录与分析都至关重要。鹰谷很高兴地宣布,鹰谷电子实验记录本InELN,与国际知名生物数据统计分析GraphPad Prism软件,实现数据快速兼容互通!使用鹰谷电子实验记录本的用户,将…

HarmonyOS的@State装饰器的底层实现

HarmonyOS的State装饰器的底层实现 序言准备工作实现State装饰器 序言 ArkTS是鸿蒙生态的应用开发语言。它在保持TypeScript(简称TS)基本语法风格的基础上,进一步通过规范强化静态检查和分析,使得在程序运行之前的开发期能检测更…

实战:深入探讨 MySQL 和 SQL Server 全文索引的使用及其弊端

在数据库中处理大量文本数据时,包含搜索(例如查找包含特定单词的文本)往往是必需的。然而,直接使用 LIKE %text% 的方式在大数据量中进行模糊查询会造成性能瓶颈。为了解决这一问题,MySQL 和 SQL Server 提供了全文索引(Full-Text Indexing)功能,可以显著加速文本数据的…

shell 100例

1、每天写一个文件 (题目要求) 请按照这样的日期格式(xxxx-xx-xx每日生成一个文件 例如生成的文件为2017-12-20.log,并且把磁盘的使用情况写到到这个文件中不用考虑cron,仅仅写脚本即可 [核心要点] date命令用法 df命令 知识补充&#xff1…

网络管理之---3种网络模式配置

目标: 了解几个概念: 1.什么是IP?什么是IP地址? 2.什么是桥接、NAT、仅主机模式 3.端口? 4.什么是网络接口命名规则 5.网络管理器 IP:指网络之间互联的协议,是TCP/IP 体系中的网络协议 I…

ubuntu 下mosquitto TLS配置

1、/etc/mosquitto/mosquitto.conf文件配置 persistence true persistence_location /var/lib/mosquitto/ log_dest file /var/log/mosquitto/mosquitto.log include_dir /etc/mosquitto/conf.d listener 1883 listener 8883 0.0.0.0 password_file /etc/mosquitto/pwfile cert…

zabbix搭建钉钉告警流程

目录 🌤️zabbix实验规划 🌤️zabbix实验步骤 📑1 使用钉钉添加一个自定义的机器人 ​ 📑2在zabbix-server上编写钉钉信息发送脚本,设置钉钉报警媒介 ☁️ 设置钉钉报警媒介​编辑​编辑 ☁️在添加消息模板​编辑​…

【JavaWeb】JavaWeb入门之XML详解

目录 1.XML介绍 1.1.XML概述 1.1.1.什么是XML 1.1.2.XML的作用 1.1.3.XML与HTML的比较 1.1.4.XML和properties(属性文件)比较 1.1.5.W3C组织 1.2.XML语法概述 1.2.1.XML文档展示 1.2.2.XML文档的组成部分 1.3.XML文档声明 1.3.1.什么是XML文…

基于Zynq FPGA对雷龙SD NAND的测试

一、SD NAND特征 1.1 SD卡简介 雷龙的SD NAND有很多型号,在测试中使用的是CSNP4GCR01-AMW与CSNP32GCR01-AOW。芯片是基于NAND FLASH和 SD控制器实现的SD卡。具有强大的坏块管理和纠错功能,并且在意外掉电的情况下同样能保证数据的安全。 其特点如下&…