微信小程序数据请求

1.api.js的配置

与page页面同级创建一个API文件夹，然后在API文件夹下面创建一个api.js的文件。 POST,以及GET请求方式

function sendPostReuest(url,params){
  return new Promise(function(resolve,reject){
    wx.request({
      url: url,
      data:params,
      method:"Post",
      success(res){
        resolve(res)
      },
      fail(res){
        reject(res)
      }
    })
  })
}

function sendGetReuest(url,params){
  return new Promise(function(resolve,reject){
    wx.request({
      url: url,
      data:params,
      success(res){
        resolve(res)
      },
      fail(res){
        reject(res)
      }
    })
  })
}
var baseUrl = "https://www.sunhuayu.com:3001";
module.exports ={
 getsongsData(){
    return sendGetReuest(baseUrl + "/personalized")
   },
   getsongsrequest(id){
     return sendGetReuest(baseUrl+"/playlist/detail?id="+id+"")
   },
   getsongslink(id){
    return sendGetReuest(baseUrl+"/song/url?id="+id+"")
  },
  getsearchData(keywords){
    return sendGetReuest(baseUrl+"/search",keywords)
  }
}

如果在其他页面用到此数据请求，首先我们把api.js导入到页面中，如下所示：

import api from "../../API/api.js"

ready(){
    api.getsongsData().then(data=>{
      // 获取歌单列表
      this.setData({
       songsList:data.data.result
      }),
      // 设置播放列表
      this.innerAudioContext = wx.createInnerAudioContext()
      // 检测是否一首歌曲已经结束，如果结束了，就播放下一首
      // 如果10首歌曲播放完了，那么设置其从第一首开始播放
      this.innerAudioContext.onEnded((res)=>{
        console.log("结束")
        this.data.number++
        if(this.data.number==10){
          this.data.number=0
        }
        console.log(this.data.number)
        this.innerAudioContext.autoplay = true
        // 调用startsings方法，播放歌曲
        this.startsings()
      })
    })   
   }
   

下面的例子是直接的地址请求，没有进行配置，讲解请求的原理

Page({
  data: {
    "indicatorDots":true,
    "autoplay":true,
    "interval":1000,
    "duration":500,
    'bannerList':[],
    "circular":true,
    'Nineimg':[]
  },
  onLoad(){
    this.getData(),//当页面加载的时候调用getData函数
    this.getNineNumber()
  },
  getData(){
    var that = this
    wx.request({
      url: 'https://locally.uieee.com/slides', //必须写的
      method:"GET",                            //必须写的，默认为GET
      
      data:{},
      timeout:30000,
      
      <!--如果数据请求成功，则获取数据，将其赋值给data里面的bannerList-->
      success(res){
        that.setData({
          bannerList:res.data
        })
      },
      fail(err){
        console.log(err)
      },
      complete(){
        // console.log("数据请求完成！！！")
      }
    })
  },
  getNineNumber(){
  <!--解决this指向问题-->
    var that = this 
    wx.request({
      url: 'https://locally.uieee.com/categories',
      method:"GET",
      success(res){
        that.setData({
          Nineimg:res.data
        })
        // console.log(res.data)
      }
    })
  }
 
})