小程序封装了wx.request请求并创建了接口管理文件

开发小程序，仍然需要打包一个简单易用的wx.request请求，这样可以节省大量的维护成本！八卦并不多说，直接撸代码。

过程

创建一个http.js文件，包装wx.request以创建一个api.js文件，并管理所有接口以调用index.js中的接口

创建 http.js 文件，封装 wx.request

在utils中创建一个http.js文件，包装http，代码如下：

Module.exports={http（url，method，params）{let token='token'//获取令牌，获取令牌和签名，令牌和签名表示每个接口发送的数据。 let sign='sign'//获取签名数据={token，sign} if（params.data）{//这里确定数据是否存在，params表示前端需要传递的数据，params是一个对象，有三组键值对，数据：要发送的请求数据，成功：成功回调，失败：回调失败，这三个字段可能丢失，其余字段将忽略（让键入params。 data）{//这里确定传递的参数如果值为null，则删除此属性if（params.data [key]==null || params.data [key]=='null'）{delete params.data [key]}} data={. data， params.data}} wx.request（{url:'https://www.apiopen.top'+ url，//是拼接上的前缀，界面域名是开放接口，你可以访问方法:方法=='post'？'post':'get'，//确定请求类型，除了值等于'post'其余的值被视为获取数据，ERP系统

标题: {'content-type':'application/json'}，success（res）{params.success＆amp;¶ms.success（res.data）}，fail（err）{params.fail＆amp;¶ms.fail（错误）}}）}}复制代码

代码非常简单，需要说明只需要在逻辑代码中传递params，并在接口文件中传递url和方法，便于统一管理

创建 api.js 文件，统一管理所有接口

使用utils在utils下创建一个api.js文件作为接口管理文件，其代码如下：

//在这里定义所有接口，一个文件管理所有接口，从'./http'轻松维护import {http}; //介绍刚包装的http模块，导入属于ES6语法，微信开发工具必须打开ES6到ES5选项函数femaleNameApi（params）{//请求随机古诗界面http（'/femaleNameApi'，'get'，params ）//接口请求的路由地址和请求方法在这里传递} //每个接口定义一个函数，然后公开它，为逻辑代码调用函数novelApi（params）{//新颖推荐接口http（'/novelApi'，'get'，params）} export default {//公开接口femaleNameApi，novelApi}复制代码

使用api.js文件统一管理的优点是更新后修改界面非常方便。您不需要查看逻辑代码，也不需要关心调用此接口。您可以直接在app.js中修改响应。非常必要

在 index.js 中调用接口

调用方法，代码如下

从'./utils/api'导入http //引入api接口管理文件页面（{data: {femaleList: []}，onLoad: function（）{http.femaleNameApi（{//call interface，pass in parameter data: {page: 1}，success: res=＆gt; {console.log（'interface request success'，res）this.setData（{femaleList: res.data}）}，fail: err=＆gt; {console。 log（err）}}）}}）复制代码

参数在描述:中传递

为了匹配微信 API接口调用方法，通过调用方法微信API传输对象。该对象有三组键值对，data：表示要发送的数据，成功：成功回调，失败：失败回调三个键值对可以传递或不传递，其余的值将被忽略了。基本和微信API呼叫模式是相同的，这减少了强迫症的麻烦

我第一次发布了一篇关于掘金队的文章，我想请你的老年人给我更多建议！

github上的小程序代码片段，欢迎问题