小程序接口封装

没有特别的幸运,那么就特别的努力!!!

既然没有优人的天赋,那就拼吧!

看下接口数据

在这里插入图片描述

先看下封装好——界面调用方法

//第一步 引入封装好的api ——————调用里面方法
import { nestApi_zfry_findEnforceLawMessageList } from '../../../utils/api.js'


 /*** 生命周期函数--监听页面加载*/
  onLoad: function (options) {
	this.zfjgList();   
  }
  
  
//调用接口
  zfjgList(){
    let params = {
      zt:this.data.val, //0、待抽查 1、已完成抽查
      search:this.data.keywordBox || '',
    }
	//loading 懒加载样式
    wx.showLoading({
      title:'加载中...'
    }) 
    
    //请求接口数据
    nestApi_zfry_findEnforceLawMessageList(params).then(res => {
      wx.hideLoading()
      console.log(res)
    })
  },

看完接口调用方式,现在我们来看下怎么封装wx.request({})

1.首先建立一个http.js文件
/**
 * 封装http 请求方法
 */ 
const apiUrl = "https://scdn.star7.cn:444/nrmm-applet-web/"; //线上服务器
// const apiUrl = "https://192.168.14.42:80/"; //本地地址
// const apiUrl = "http://115.233.209.141:9192/nrmm-applet-web/"; //测试api地址

const http = (params) => { 
  //返回promise 对象
  return new Promise((resolve, reject) => {
    wx.request({
      url: apiUrl + params.url,    //服务器url+参数中携带的接口具体地址
      data: params.data,   //请求参数
      header: params.header || {
        "Content-Type": "application/json",   //设置后端需要的常用的格式就好,特殊情况调用的时候单独设置
      },
      method: params.method || 'POST',   //默认为POST,可以不写
      dataType: params.dataType,         //返回的数据格式,默认为JSON,特殊格式可以在调用的时候传入参数
      responseType: params.responseType, //响应的数据类型
      success: function (res) {
        //接口访问正常返回数据
        resolve(res.data)
        // console.log(res)
        if(res.data.code != 200){

          wx.showToast({
            icon:'none',
            title: res.data.message
          }) 

        } 
		
		//这一步 根据后端  来协定
        if (res.data.message == '令牌失效,请重新登录!') {
         
          wx.navigateTo({
            url: '/pages/index/index',
          })
        }


      },
      fail: function (e) {
        wx.showToast({
          icon:'none',
          title: '请求失败',
        })
        reject(e)
      }
    })
  })
}

//抛出http 方便别的界面调用
module.exports = {
  http: http
} 
2.建立 api.js 接口文件,数据接口文件集合——方便维护
//1.首先引入封装http.js文件,调用抛出的http
import {http} from 'http.js'

//2.接口路径
let url = { 
  postApply:'machine/saveMachineTemp',  //机械申报
  getDetail:'machine/findMachineTempOne',  //获取机械详情
  nestApi_enforce_saveEnforceLawMessage:'/enforce/saveEnforceLawMessage',  //提交或保存执法结果记录
} 

//抛出数据
module.exports = {

  // 机械申报
  postApply(params,token){
    return http({
      url: url.postApply,
      header: {
        "Content-Type": "application/json",   
        "token": token
      },
      data: params,
    })
  },

  // 获取机械详情
  getDetail(params) {
    return http({
      url: url.getDetail,
      method: "GET",
      data: params,
    })
  },

  //提交或保存执法结果记录
  nestApi_enforce_saveEnforceLawMessage(params){
    return http({
      url: url.nestApi_enforce_saveEnforceLawMessage,
      method: "POST",
      data: params,
    })
  },



 }

希望能帮助到大家,同时祝愿大家在开发旅途中愉快!!!

拿着 不谢 请叫我“锤” !!!

猜你喜欢

转载自blog.csdn.net/hammer1010/article/details/106366150