小程序向后台请求数据接口封装

第一步:先在util文件里新建index.js,写入以下代码。
在这里插入图片描述

const baseUrl = 'http://192.168.0.117:8080/SC_ncm'
/**
 * 数据请求模块
 * 接口地址 http://daxun.kuboy.top/apidoc
 * 先显示加载框,然后请求结束加载框消失
 * 
 */
export function request (url, data) {
  // 显示加载中
  // 参考https://developers.weixin.qq.com/miniprogram/dev/api/ui/interaction/wx.showLoading.html
  wx.showLoading({
    title: '加载中',
  })
  // 使用promise 解决异步操作问题,此处还可以使用 async + await
  return new Promise((resolve, reject) => {
    // 微信小程序的数据请求方法
    // 必须配置小程序的安全域名,
    // 在开发阶段可以在“详情” - “本地设置” - 勾选中 不校验请求域名、web-view(业务域名)、TLS版本及HTTPS证书
    wx.request({
      url: baseUrl + url,
      method:"POST",
      data: data || {},
      success: (res) => {
        // 隐藏加载中
        wx.hideLoading();
        // 后续处理
        resolve(res.data)
      }
    })
  })
}

/**
 * 可消失的提示框 - 默认只显示文字
 * str 提示内容
 * icon 是否需要图标,none 、 success(默认值) 、 loading
 */
export function Toast (str, icon) {
  // 微信提供的API接口
  // 参照 https://developers.weixin.qq.com/miniprogram/dev/api/ui/interaction/wx.showToast.html
  wx.showToast({
    title: str,
    icon: icon || 'none'
  })
}

第二步:在所需的页面中page.js中写入,需要导入刚才所写的文件夹
import { request } from ‘./…/…/utils/index.js’
在这里插入图片描述

//index.js
//获取应用实例
const app = getApp()
import { request } from './../../utils/index.js'
Page({
  data: {
   
  },

  // onLoad: function (options) {
  //   let param = {
  //     login_name:"111",
  //     password:"111"
  //   }
  //   request('/checkLogin',param).then(data => {
  //     console.log(data)
  //     // 微信小程序修改数据的方式
  //   })
  // },这种方式也可以
  onLoad: function () {
      this.queryMenu()
  },
  queryMenu(){
    let params = {
      food_name:"111",
      food_type:"111",
      restaurant_id:"SCNC2006171751500765122580"
    }
    request('/checkLogin',params).then(data => {
      console.log(data)
      // 微信小程序修改数据的方式
    })
  },
})

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值