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. 页面中的使用

<script>import api from '@/api/index.js'export default {data() {return {swiperList: []};},onLoad() {this.getSwiperList()},methods:{async getSwiperList() {this.swiperList = await api.getData('/home/swiperdata') // 注意地址跟我的不一样 你得改嗷}}}
</script>

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

luch-request 在uniapp项目中的使用相关推荐

uniapp android原生,在uni-app项目中集成Android原生工程
[TOC] # 在uni-app项目中集成Android原生工程按照官方的方案,我们如果进行本地打包的话,需要重新创建一个Android原生工程,于是就会导致我们管理多个项目,切来切去的也麻烦. 经 ...
uni-app项目中使用iconfont
最近在做uniapp 项目,正好要使用iconfont, 顺便做个小分享 1.首先要在iconfont 官网,点击资源管理--我的项目,点击页面中的➕ 2. 选择需要的图标加入购物车,添加完毕,点击 ...
uniapp项目中使用canvas生成海报并保存、微信分享、发送至朋友圈
uniapp项目中使用canvas生成海报并保存.微信分享.发送至朋友圈 1.html <canvas canvas-id="poster&qu ...
在uni-app项目中设置背景颜色/微信小程序设置 backgroundColor无效的问题
在DCloud的官方提供的文档中写的方法是这样,如下但是实际设置了之后,没有作用,然后搜了一下说是因为 backgroundColor 指的窗体背景颜色,而不是页面的背景颜色,即窗体下拉刷新或上拉加 ...
uni-app项目中引入Vant UI组件库（完美避坑！！！）纯净版
文章目录第一步,HBuilder X中新建一个uni-app的项目第二步,HBuilder X提示项目创建成功,在HBuilder X用命令行窗口打开创建的项目(或直接在创建的项目文件夹内用cmd ...
uniapp 项目中添加百度统计
需求描述在uniapp开发的H5项目中,需要通过百度统计代码将用户的操作信息进行记录统计. 1.新建 count.html 文件将文件放置在项目根目录下,文件名称自己随意. 2.百度统计代码 ...
uniapp项目中引入iconfont图标
在项目中,难免出现图标不满足我们需求的情况,我们可以去阿里图标库(iconfont-阿里巴巴矢量图标库)选择我们满意的图标. 最近在做uniapp的项目,记录一下引入iconfont的步骤 1.去官网 ...
HBuilder X中新建uni-app项目中的Hello uni-app模板后，自己添加的页面为什么运行时不显示，找不到入口？
在HBuilderX中新建了一个uni-app项目,然后选择了Hello uni-app模板进行测试编译,发现自己在pages目录下新建一个my-test文件夹后在此文件下进行编写测试,发现运行起来没 ...
uniapp项目中使用阿里图标
一.uniapp引入阿里图标 1.第一步:选择想要的图标加入购物车注意:批量注入的方法(按F12 在console里面输入下方的代码) var span = document.querySelect ...
uni-app项目中画布实现海报
文章目录前言一.canvas的概述? 二.drawImage 相关参数介绍 1.描述 2.图解 3.项目的实际使用前言关于uni-app中使用画布的文档很少,也不是很详细,正好在最近的项目中用 ...

luch-request 在uniapp项目中的使用

luch-request

luch-request 在uniapp项目中的使用相关推荐

最新文章

热门文章