uni-app之request-miniprogram配置网络请求

uni-app之request-miniprogram配置网络请求

uni-app开发小程序

1、 使用@escook/request-miniprogram配置网络请求
注：因为小程序中无法使用axios，而wx.request功能过于简单，所以下载加强版网络请求包，实现如下：
​ 1.1 安装

npm init -y		在项目根目录初始化package.json文件

npm i @escook/request-miniprogram -S 下载网络请求包

​ 1.2 打开main.js配置入口文件

//导入网络请求的包
import {
	$http
} from '@escook/request-miniprogram'
//从网络请求包中引入$http请求对象
uni.$http = $http

//配置请求根路径
$http.baseUrl = 'https://xxx.com'

//请求拦截器
$http.beforeRequest = function(options) {
	uni.showLoading({
		title: '数据加载中...'
	})
}

//响应拦截器
$http.afterRequest = function (){
	uni.hideLoading()
}
//封装弹框方法
uni.$showMsg =  function (title='数据请求失败！',duration=1500){
	uni.showToast({
		title,
		duration,
		icon:'none'
	})
}

1.3 发起网络请求

async getNavList() {
		const { data: res } = await uni.$http.get('/api')
		if (res.meta.status !== 200) return uni.$showMsg()
		this.navList = res.message
},

2、配置小程序分包
1.在项目根文件中，创建一个subpkg文件来存放分包
2.在pages.json中，page同级节点，创建subPackages节点（选择新建页面，输入文件夹的名称，选择scss模板选择小程序的分包时在刚才创建的subpkg文件夹，会把路径自动添加到分包路径中）

"subPackages":[
		{
            //root表示根文件
			"root":"subpkg",
            //分包路径
			"pages":[]
		}
	]