班级网站的建设,免费photoshop下载,网站做产品的审核工作,网站定制哪家安全一. 在utils文件夹内创建一个request.js 写以下封装的 wx.request() 方法
const baseURL https:// 域名 ; //公用总路径地址
export const request (params) { //暴露出去一个函数#xff0c;并且接收一个外部传入的参数let dataObj params.data || {}; //…一. 在utils文件夹内创建一个request.js 写以下封装的 wx.request() 方法
const baseURL https:// 域名 ; //公用总路径地址
export const request (params) { //暴露出去一个函数并且接收一个外部传入的参数let dataObj params.data || {}; //拿到传递进来的参数let headerObj { //这里 可以添加一些请求头content-type: application/json}return new Promise((resolve, reject) { //通过 Promise 对 wx.request 方法进行异步处理。wx.request({url: baseURL params.url, //通过默认的请求地址再加上外部传入的 具体业务地址组成一个完整的 请求地址。method: params.method || GET, //外部 业务调用请求时并传入 所需的请求方法如果没有传递请求方法则默认为 GET 请求data: dataObj, //这里的参数来自于外部传入的参数header: headerObj,success: res {if (res.statusCode 200) {resolve(res); // 请求成功后调用 Promise 的回调 resolve() 方法将参数返回出去到 Promise 的实例对象身上。wx.showToast({title: 请求成功,icon: success})return;} else {wx.showToast({title: 请求失败,icon: error})reject(res); //同样请求失败后向 Promise 实例返回出 错误的信息}},// fail: err {// reject(err) //同样请求失败后向 Promise 实例返回出 错误的信息// }})})
}二 . 在项目中新建一个 API文件夹用来做请求接口 模块化管理这么做的原因是虽然我们的请求接口封装了但是整个项目中调用接口的地方太多了如果直接在各自页面中调用也会显得代码十分的庸杂所以不同的功能模块接口调用为了避免混淆在一起建议将api 请求接口 抽离出去这样一来页面的 js 部分就只着重于对发起请求前和请求响应后的数据逻辑处理。
api/index/js
import { request } from ../utils/request; //导入我们封装的请求方法。//首页请求接口
export const index (params) { //接收页面调用传递过来的参数return request({ //调用请求方法url: /api/science/index, //传入请求地址method: GET, //传入请求方法data : params //这里的参数来自于页面调用时传过来的参数 })
}三 . 必须配置服务器白域名 必须是https开头的 最后在页面中调用上述模块中相应的 api 接口将参数依次传递过去同时由于我们的请求方法是采用了 Promise 的方式封装的所以在页面逻辑调用时还可以 使用 async 和 await 的方式将异步代码做同步化处理。
// const { from } require(form-data);
import {index} from ../../api/index.js;// pages/demos/demos.js
Page({/*** 页面的初始数据*/data: {},async getdatas() {let parameter {} //页面中收集处理好要传递的参数let data await index(parameter);console.log(data);//data 身上就可以直接拿到请求回来的数据。// if (data.statusCode 200) {// wx.showToast({// title: 首页加载成功,// icon: success// })// }},/*** 生命周期函数--监听页面加载*/onLoad(options) {this.getdatas();},/*** 用户点击右上角分享*/onShareAppMessage() {}
}) 原创作者吴小糖
创作时间2023.12.22
