LinUI学习3 Http请求封装与使用

LinUI学习3 Http请求封装与使用

配置config

首先需要新建一个config文件夹，在其内部新建一个config.js文件用来配置请求所需要的一些参数，详情见前一篇博客。

代码如下

const config ={
  appkey:'****',
  apiBaseUrl:'****'
}
export{
  config
}

 

封装公用http

在utils文件夹内新建一个Http.js文件

const { config } = require("../config/config")  //引入前面定义的config 

class Http {
  static request({url, data, callback, method = 'GET'}) {
    wx.request({
      url:`${config.apiBaseUrl}${url}`,
      data,
      method,
      header: {
        appkey: `${config.appkey}`
      },
      success(res) {
        callback(res.data)
      }
    })
  }
}
export{
  Http
}

 

封装http请求

示例：theme.js

新建一个model文件夹（为了便于维护，尽可能的将page的js用于数据绑定，不做逻辑处理，所以单独建立一个model文件夹）

新建一个theme.js 文件

import { Http } from "../utils/http"   //引入之前定义好的公共http请求

class Theme{
  static getHomeLocationA(callback){
    Http.request({
      url:`****`,
      data:{
        names:'t-1'
      },
      callback:data=>{
        callback(data)
      },
    })
  }
}
export{
  Theme
}

 

Http请求调用

在需要用到请求的js内如下调用

  Theme.getHomeLocationA(data =>{
    this.setData({
      topTheme:data //具体格式按照需求来
    })