uni-app 基于Promise封装uni-app的request方法,类似vue中axios形式的请求封装

适用于:

  1. 小程序
  2. app
  3. H5

安装 uni-request

npm install uni-request --save

封装 uni-request (utils => request.js)

import uniRequest from 'uni-request';


uniRequest.defaults.baseURL = process.env.NODE_ENV == 'development' ? 'XXXXXX' :
	'XXXXXX'  //接口根据环境自己写
uniRequest.defaults.headers['X-Requested-With'] = 'XMLHttpRequest'
uniRequest.defaults.headers['token'] = uni.getStorageSync('token') || ''
uniRequest.defaults.headers.post['Content-Type'] = 'application/json';

uniRequest.interceptors.response.use(res => {
	if (typeof res.data !== 'object') {
		uni.showModal({
			title: '服务器端异常',
		});
		return Promise.reject(res)
	}
	if (res.data.code == 999) {
		uni.reLaunch({
			url: '/pages/login/login'
		});
	}
	if (res.data.code != 100) {
		if (res.data.message) {
			uni.showModal({
				title: res.data.message,
			});
		}
		return Promise.reject(res.data)
	}
	return res.data
})


export default uniRequest


接口文件 (server=> home.js)

import requset from '../utils/request.js'

export function getHome() {
  return requset.post('/merber/index');
}

页面使用

<template>
	<view class="content">
		<button type="default" @click="test">测试接口</button>
	</view>
</template>

<script>
	import {
		getHome
	} from "../../server/home.js";
	export default {
		methods: {
			async test() {
				const data = await getHome();
				console.log(data);
			},
		}
	}
</script>

完工!

提供的请求方法(可自己封装)

uniRequest.request(config)
uniRequest.get(url[, config])
uniRequest.delete(url[, config])
uniRequest.head(url[, config])
uniRequest.options(url[, config])
uniRequest.post(url[, data[, config]])
uniRequest.put(url[, data[, config]])
uniRequest.patch(url[, data[, config]])
  • 3
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 3
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值