原声微信小程序简单封装axios笔记

  1. 封装文件(util.js)

    // axios
    const getHerder = (params) => {
      const openid = wx.getStorageSync('OPENID') //登陆的openid
      const userViewId = wx.getStorageSync('USERViewId') //登陆的用户id
      const token = wx.getStorageSync('TOKEN') //登陆的token
    ​
      const data = {
        platform: 'consumer',
        tenantId: 6900, //租户ID
        openid: openid ? openid : '',
        userViewId: userViewId ? userViewId : '',
        token,
      }
      return params ? {
        'Content-Type': 'application/json',
        ...data
      } : {
        'Content-Type': 'application/x-www-form-urlencoded',
        ...data
      }
    }
    ​
    const request = (
      url,
      data,
      methods = false,
      dataType = true, 
      isLoading = false,
    ) => {
      if (!isLoading) {
        // wx.showToast({
        //   title: '加载中',
        //   mask: true,
        //   icon: 'loading',
        //   duration: 2000
        // })
        wx.showLoading({
          title: '加载中',
          mask: true,
        })
      }
    ​
      const promise = new Promise((resolve, reject) => {
        wx.request({
          url: `http://192.168.110.205:8090${url}`, //服务器地址
          data,
          header: getHerder(dataType),
          method: methods ? 'GET' : 'POST',
          success(res) {
            if (res.statusCode == 403) {
              wx.clearStorage()
              _goLogin()
            } else if (res.statusCode == 200) {
              if (res.data.code == 200) {
                resolve(res)
                wx.hideToast()
              } else if (res.data.code == 600) {
                //未登录
                wx.hideToast()
                _goLogin()
              } else {
                wx.hideToast()
                reject(res.data)
                errHandler(res.data.msg, 2000)
              }
            } else if (res.statusCode == 401) {
              wx.showModal({
                content: '您未登录,请先前往首页去办理登录!',
                showCancel: false,
                confirmText: '去登陆',
                success(res) {
                  wx.clearStorage()
                  wx.reLaunch({
                    url: '/pages/featureGather/featureGather'
                  })
                }
              })
            } else {
              wx.showToast({
                title: '请求错误',
                icon: 'none',
                duration: 2000
              })
            }
            wx.hideLoading()
          },
          fail(res) {
            const msg = '网络请求错误!'
            reject(res)
            errHandler(msg)
            wx.hideLoading()
          }
        })
      })
      return promise
    }
    const errHandler = (
      msg,
      duration = 1500,
      icon = 'none'
    ) => {
      wx.showToast({
        title: msg,
        duration,
        icon
      })
    }
    ​
    module.exports = {
      request,
    }

  2. api文件(common.js)

    import {
      request
    } from '../utils/util.js'
    ​
    // 
    export function weixinJsapiPay(params) { 
     //(接口路径,参数,true=get,false=post)
      return request('/xcx/******/******/88888JsapiPay', params, false)
    }

  3. 页面使用(home.js)

    //页面引入
    import {
     weixinJsapiPay
    } from '@/api/'
    //使用s
    const data = weixinJsapiPay({
      data
    })
    ​
    ​

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐