为什么应该在uni-app项目里使用luch-request?
发布日期:2022-02-17 02:39:53 浏览次数:26 分类:技术文章

本文共 2443 字,大约阅读时间需要 8 分钟。

uni-app 是一个使用 Vue.js 开发所有前端应用的框架,开发者编写一套代码,可发布到iOS、Android、H5、以及各种小程序(微信/支付宝/百度/头条/QQ/钉钉/淘宝)、快应用等多个平台。

项目的开发离不开数据交互,一个好的request请求库可以让我们的开发事半功倍。uni-app也不例外,uni.request只提供基础请求功能,无法达到项目开发的要求,luch-request应运而生。

luch-request 官网

luch-request是什么?

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

luch-request诞生于19-05月,至今已迭代20多个版本。DCloud插件市场request类插件下载量第一。支持npm下载。

它能为我们解决什么问题?

  • 支持全局挂载
  • 支持多个全局配置实例
  • 支持自定义验证器
  • 支持文件上传/下载
  • 支持task 操作
  • 支持自定义参数
  • 支持多请求拦截器/响应拦截器
  • 对参数的处理比uni.request 更强

也许你还不明白这些有什么用。但是他却对应着我们开发中一个一个的痛点。

你的数据获取方式

uni.request({
url: this.$baseUrl + 'api/user?arg1=data1' method: 'POST', data: {
id:1}, header: {
Content-Type: '...', token: '....'} success: (res) => {
}, fail: (err) => {
}})

使用luch-request后

this.$http.post('/api/user', {
id: 1}, {
params: {
arg1: data1 }}).then(res => {
...}).catch(err => {
...})

它有什么优势?

条件编译开发: 减少代码体积,减少开发中debug时的误导影响。看不到对应终端额外的参数。

极易的自定义能力: 有些插件会把loading、auth等参数加入配置,使其做一些请求之外的操作,这些配置并不是所有人都会使用。request请求库只需专注于请求即可。luch-request对额外操作的处理则更为优雅,增加了custom配置,使开发者可以做一些自定义操作。

http.setConfig((config) => {
/* config 为默认全局配置*/ config.baseURL = 'http://www.quanzhan.co' /* 根域名 */ config.custom = {
loading: true // 默认有loading } return config})http.interceptors.request.use((config) => {
/* 请求之前拦截器。可以使用async await 做异步操作 */ config.header = {
...config.header, a: 1 // 演示拦截器header加参 } // 演示custom 用处 if (config.custom.loading) {
uni.showLoading() } return config}, (config) => {
return Promise.reject(config)})http.interceptors.response.use(async (response) => {
/* 请求之后拦截器。可以使用async await 做异步操作 */ // if (response.data.code !== 200) { // 服务端返回的状态码不等于200,则reject() // return Promise.reject(response) // } if (response.config.custom.loading) {
uni.hideLoading() } return response}, (response) => {
// 请求错误做点什么。可以使用async await 做异步操作 console.log(response) if (response.config.custom.loading) {
uni.hideLoading() } return Promise.reject(response)})// 单接口不想要loadinghttp.get('user/list', {
custom: {
loading: false}})http.post('user/list', {
}, {
custom: {
loading: false}})

易用的api设计: 部分api设计为降低学习成本,参照axios设计。并扩展一些其它的api,入门更加容易。

快速上手

npm
npm i luch-request -S

cli 用户使用npm 包需增加以下配置项目根路径下创建vue.config.js 文件,增加以下内容

// vue.config.js module.exports = {
transpileDependencies: ['luch-request'] }
GitHub

使用DCloud/luch-request 文件夹即可

DCloud插件市场

luch-request DCloud 插件市场

luch-request官网

luch的博客网站logo

更新历史

转载地址:https://blog.csdn.net/qq_39815124/article/details/107181859 如侵犯您的版权,请留言回复原文章的地址,我们会给您删除此文章,给您带来不便请您谅解!

上一篇:前缀表达式、中缀表达式、后缀表达式
下一篇:luch-request 官网

发表评论

最新留言

留言是一种美德,欢迎回访!
[***.207.175.100]2024年03月04日 15时38分31秒

关于作者

    喝酒易醉,品茶养心,人生如梦,品茶悟道,何以解忧?唯有杜康!
-- 愿君每日到此一游!

推荐文章

cmd mysql 数据分析_小白学数据分析--与MySQL有关的小知识 2019-04-21
java完成九宫格数独_简单实现java数独游戏 2019-04-21
php 安装zip,php7.4安装zip扩展 2019-04-21
php7 gitbook,php7性能分析扩展工具xhprof 2019-04-21
java wav 切割_java切割音频文件 2019-04-21
java获取服务器编码_使用Java代码获取服务器性能信息及局域网内主机名 2019-04-21
mysql 导出json_如何将MySQL数据库导出到JSON? 2019-04-21
嵌入式Linux咨询公司,Technical support and consulting 2019-04-21
linux 离线安装中文字库,centos7 离线安装字体fontconfig 2019-04-21
可以使用鸿蒙系统的55款手机,华为鸿蒙系统首批适配机型即将公布,共有55款产品可升级搭载... 2019-04-21
鸿蒙系统chromeos2.0,【华为鸿蒙系统】鸿蒙OS 2.0 适配计划曝光 2019-04-21
android高德地图设置缩放级别,设置地图中心点/级别 2019-04-21
dv4 安装linux,linux安装中的问题 2019-04-21
gmat阅读.html,GMAT阅读“Ecoefficiency”文章深度分析 2019-04-21
html5 带图片导航,html5 带声音的导航 2019-04-21
point 如何求elbow_机器人学——实践一(Arm Navigation 理论+代码) 2019-04-21
avs3 mkv格式封装_将你的视频无损封装成MP4,非转码哦! 2019-04-21
java http服务端_HTTP协议经典面试题整理及答案详解 2021-06-24
mysql 递归查找父节点_数据结构与算法—浅显易懂的二叉排序(查找)树 2021-06-24
body里写注释 postman_使用 Postman 做 API 自动化测试 2019-04-21