Arkts完成数据请求http以及使用axios第三方库

发布于:2025-05-01 ⋅ 阅读:(46) ⋅ 点赞:(0)
import http from '@ohos.net.http'
@Entry
@Component
struct HttpPage {
  @State message: string = 'Hello World'

  build() {
    Column({space:20}) {
      Row(){
        Button('发送http请求')
          .onClick(()=>{
            let httpRequest = http.createHttp();
            httpRequest.request(
              'https://zzgoodqc.cn/index.php/index/qus/getquestionlist',
              {
                method:http.RequestMethod.POST,
                extraData:{
                  sn:'1001'
                }
              }
            )
              .then(resp=>{
                console.log("resp=>",JSON.stringify(resp))
                if(resp.responseCode === 200){
                  console.log(resp.result.toString())
                }
              }).catch(err=>{
              console.log('请求错误err=>',err)
            })

          })
      }

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

以上是方案1:默认数据请求

方案二:使用axios第三方库请求接口

第一步:安装aixos,执行

ohpm install @ohos/axios

第二步:注意配置网络权限,在module.json5文件中

    "requestPermissions":[
      {
        "name": "ohos.permission.INTERNET"
      }
    ],

第三步:类似vue,正常引入使用

import axios from  '@ohos/axios'
@Entry
@Component
struct HttpPage {
  @State message: string = 'Hello World'

  build() {
    Column({space:20}) {
   Row(){
          Button('发送axios请求')
            .onClick(()=>{
              axios.post(
                'https://zzgoodqc.cn/index.php/index/qus/getquestionlist',
                {
                  sn:'1001'
                }
              ).then(response=>{
                console.log("response=>",JSON.stringify( response))
              }).catch(err=>{
                console.log('err=>',err)
              })
            })

        }


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


网站公告

今日签到

点亮在社区的每一天
去签到