luch-request 在uniapp项目中的使用

luch-request

基于Promise开发的跨平台、项目级别的请求库,它有更小的体积,易用的api,方便简单的自定义能力

1. 我是在插件市场导入的:luch-request - DCloud 插件市场

也可以 npm 安装

执行命令

npm init -y // 项目内有 package.json 文件可以忽略这个命令
npm i luch-request -S

2. 在根目录下新建 utils 文件夹并创建自定义文件 request.js 文件

import Request from "../js_sdk/luch-request/luch-request/index.js" 
                                   // 导入的文件路径可能跟我不一样
import Request from 'luch-request' // 自己注意也可以写成这种

// 下面这些可以直接复制  已经精简了 再删下去该报错了

const http = new Request ({
  baseURL: "", // 你的基地址
  timeout: 5000, // 响应时间为5秒
})

// 请求拦截器
http.interceptors.request.use(config => {
  return config
}, error => {
  return Promise.reject(error)
})

// 响应拦截器
http.interceptors.response.use(response => {
  return response
}, error => {
  return Promise.reject(new Error(error))
})

export default http

 3. 在根目录下创建 api 文件夹并创建 index.js文件

import request from '../utils/request.js'
// 这是我的路径  注意自己的路径

export default {
  getData(url, data) {
    return request.get( url, {params: data})
  },

  postData(url, data) {
    return request.post(url, data)
  },

  putData(url, data){
    return request.put(url, data)
  },

  deleteData(url, data){
    return request.delete(url, data)
  }
}

4. 页面中的使用

参考文章:luch-request使用方法_想搞全栈的前端小白的博客-CSDN博客

你可能感兴趣的:(uni-app)