uni-app 封装接口以及使用

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了uni-app 封装接口以及使用相关的知识,希望对你有一定的参考价值。

参考技术A 1,新建api.js

const BASE_URL = 'https://222222222 /hengyuaniot-propaganda/' //后端给的url

export const myRequest = (options) =>

// console.log('进来了')

return new Promise((resolve,reject)=>

// let authtoken = uni.getStorageSync('authtoken')

uni.request(

url:BASE_URL + options.url,

data:options.data || ,

method:options.method || 'GET',

// header:

//    'Content-type': 'application/json',

// "X-Auth-Token": uni.getStorageSync('authtoken')  //这里的token指的是微信授权登录的token,用来判断小程序是否属于登录状态

// ,

dataType:'json',

success:res =>

if(res.data.code !== 0)



resolve(res)

,

fail:err =>

// uni.showToast(

// title:"请求接口失败",

// )

console.log('err',err)

reject(err)



)

)



2,在全局  main.js 引入

//引入公共接口

import myRequest from './app/api.js'

//挂载全局

Vue.prototype.$myRequest = myRequest

3,使用

integral()

let me =this

  me.$myRequest(

url: 'api/resource/index',

method: 'POST',

data:

token:me.$store.state.token,

pageNum: 1,

pageSize:me.pageSize

,

).then(res =>

// this.integrall = res.data.integral

console.log(res.data.result.list)

//成功返回的code码

var code = res.data.code

console.log(code)

//成功返回的数据

var res =res.data.result.list

if(code===200)

,

cracted()

调用

    this.integral()

uni-app请求Promise封装

参考技术A // 创建默认地址 url 常量

const BASE_URL = "http://localhost:8082"

export const requist = ( url , method , data ) =>

// return  promise 从而可以实现promise异步操作

return new Promise((resolve, reject) =>

uni.request(

// 传入的url地址

url: BASE_URL + url,

// 请求方法可填可不填(get)

method: method || "GET",

// 请求数据可填可不填 默认空对象

data: data || ,

// 响应成功回调函数

success: (res) =>

// 配置统一的 相应结果 如果 !=0(失败) 将会统一的提示动作

if (res.data.status != 0)

return uni.showToast(

title: "获取数据失败",

icon: "none"

)



// 将请求结果resolve出去

resolve(res);

,

// 如果error也会统一的提示

fail: (err) =>

return uni.showToast(

title: "请求接口失败",

icon: "none"

)

reject(err)



)

)

以上是关于uni-app 封装接口以及使用的主要内容,如果未能解决你的问题,请参考以下文章

uni-app的uni.request()请求封装

编程大白话之-uni-app中计时器的封装

uni-app请求Promise封装

uni-app 封装请求

uni-app封装网络请求promise

uni-app实战写法