uni-app開發小程序 使用@escook/request-miniprogram配置網絡請求


https://blog.csdn.net/weixin_39411655/article/details/115565689

 

1.因為小程序中無法使用axios,而wx.request功能過於簡單,所以下載加強版網絡請求包:
npm init -y 在項目根目錄初始化package.json文件

npm i @escook/request-miniprogram -S 下載網絡請求包

2.打開main.js入口文件
import { $http } from '@escook/request-miniprogram'
//從網絡請求包中引入$http請求對象
uni.$http = $http
//因為在其他的頁面或組件中也要使用,所以要將$http對象掛載到全局對象下,在uni-app中,uni是全局對象
$http.baseUrl = 'https://www.baidu.com'
//配置網絡請求基礎地址,因為uni.$http為$http的引用,所以可以直接修改$http對象下的屬性
$http.beforeRequest = function() {
//配置發起網絡請求前的攔截功能
uni.showLoading({
title: '加載中...'
})
}
$http.afterRequest = function() {
//配置網絡請求完畢后的攔截功能
uni.hideLoading()
}

// 封裝請求失敗提示信息
uni.$showMsg = function(title='數據加載失敗',duration=1500){
uni.showToast({
title,
duration,
icon:'none'
})
}

3.發起網絡請求
async getFloorList(){
const {data:{message,meta}} = awa uni.$http.get('/api')
if(meta.status !== 200) return uni.$showMsg()
this.list= message
},
————————————————
版權聲明:本文為CSDN博主「panliyou」的原創文章,遵循CC 4.0 BY-SA版權協議,轉載請附上原文出處鏈接及本聲明。
原文鏈接:https://blog.csdn.net/weixin_39411655/article/details/115565689

 

 

 

/*小程序項目中, 不支持 axios, 而且原生的 wx.request() API功能較為簡單, 不支持攔截器等全局定制的功能. 因此,
建議在 uni-app 項目中使用 @escook/request-miniprogram 第三方包發起網絡數據請求。*/
[官方文檔](https://www.npmjs.com/package/@escook/request-miniprogram)
// 1. 初始化項目
npm init -y
// 2. 安裝 @escook/request-miniprogram
npm install @escook/request-miniprogram
// 3. 使用方式(在項目的 main.js 入口文件中, 通過如下的方式進行配置)
import { $http } from '@escook/request-miniprogram'

uni.$http = $http // 把 $http 掛載到 uni 頂級對象之上

$http.baseUrl = 'https://www.example.com' // 配置請求根目錄

$http.beforeRequest = function (options) { // 請求攔截器
// do somethimg...
}

$http.afterRequest = function () { // 響應攔截器
// do something...
}
————————————————
版權聲明:本文為CSDN博主「夕心o」的原創文章,遵循CC 4.0 BY-SA版權協議,轉載請附上原文出處鏈接及本聲明。
原文鏈接:https://blog.csdn.net/qq_38779317/article/details/120123924


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM