• wx小程序知识点(三)


    三、封装小程序的数据请求

    (1)在根目录创建utils目录,创建config.js、base.js

    (2)在config.js中创建config类,并将请求路径配置给config的属性restUrl,并export

    class Config {
      constructor () {}
    }
    
    Config.restUrl = 'http://***.cn/api/v1/'
    
    export { Config }

    (3)在base.js中引入config,把url赋值给base的属性

    import { Config } from 'config.js'
    
    class Base {
      constructor() {
        this.baseRequestUrl = Config.restUrl
      }
    }

    在 class Base 中封装request方法,只接受一个param 参数

    request(params) {
        var url = this.baseRequestUrl + params.url
        if (!params.type) {
          params.type = 'GET'
        }
        wx.request({
          url: url,
          data: params.data,
          header: {
            'content-type':'application/json',
            'token': wx.getStorageSync('token')
          },
          method: params.type,
          success: function (res) {
            params.sCallback && params.sCallback(res.data)
          },
          fail: function (err) {
    
          },
          complete: function (res) {
    
          },
        })
      }

    (4)在页面的 index.js 中,构建好params的结构后,直接调用Base.request(params),例如

        var params = {
          url: 'banner/' + id,
          method: 'GET',
          sCallback:
          (res) => {
            //数据绑定
            this.setData({
              'bannerArr': res[0].item
              })
          }
       }
    this.request(params)
     
    
    
    

      

  • 相关阅读:
    10、函数介绍、函数参数、函数的返回值
    9、bytes类型,文件处理
    8、集合类型、文件处理
    7、列表类型、元组、字典类型
    6、for循环补充、可变类型与不可变类型、基本操作
    5、while循环与for循环
    4、基本运算符、if语法
    3、变量、常量、基本数据类型
    爬虫(一)
    小技能(二)
  • 原文地址:https://www.cnblogs.com/zhuxingqing/p/11391393.html
Copyright © 2020-2023  润新知