uniapp封装请求

1.先新建uniapp的demo

2.使用node进行简易服务器搭建，

先新建一个文件夹，npm init初始化，新建一个app.js文件，安装express（npm install express），

然后写一段简单的测试代码，node app.js运行

const express = require('express')
const app = express();

app.get('/list', (req, res) => {
  res.send({
    "code": 0,
    "message": "登录成功",
    "data": {
      "name": "张三"
    }
  })
})

app.listen(3009, () => {
  console.log(`端口:localhost:3009/`)
})

3.uniapp中封装

新建一个config.js放我们的接口地址

//配置服务器相关信息
export default{
  host:'http://localhost:3009',
}

发起请求

//发起请求
export const request =(options={})=>{
    return new Promise((resolve,rejects)=>{
        uni.request({
            url: config.host + options.url,
            method: options.method,
            data: options.data,
            success: (response) => {
                console.log("options: ",options);
                return resolve(response.data)
            },
            fail: (fail) => {
                console.log('fail',fail)
                return reject(fail);
            }
        })
    })
}

封装api接口

//封装api接口
import {request} from '@/utils/request.js';
export const user = (data={}) => {
    return request({
        url:'/list',
        method:'GET',
        data:data
    })
}

然后导入，使用，我这里是在onLoad中使用，在methods中使用时方法大致相同，async 请求的方法，在里面 await 接口，在别的地方使用这个方法（this.请求的方法）

//导入，使用
import {user} from '@/utils/api/user.js'
onLoad: async function() {
    let data = await user()
    console.log('data',data)
}

然后可以看到这个结果，表示成功

__EOF__

本文作者：h_h123
本文链接：https://www.cnblogs.com/huangjunhua/p/16580785.html
关于博主：评论和私信会在第一时间回复。或者直接私信我。
版权声明：本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！
声援博主：如果您觉得文章对您有帮助，可以点击文章右下角【推荐】一下。您的鼓励是博主的最大动力！