小程序——请求接口和封装url

1.在xxx.js 写下面代码

（1）在Page的data中定义一个初始值，用于赋值，把数据渲染到页面

   // 把数据渲染到页面，定义一个初始值
    userName:"

2.在utils里面封装url

// 定义接口初始值
const url = "https://ehcto.com/";
const getUrl =function(){
  return url + data;
}

module.exports = {
  formatTime:formatTime,
  
  // 把getUrl写进去
  getUrl:getUrl
}

3.在xxx.js文件引入utils文件

// 引入util文件
const util = require('../../utils/util.js');
// 定义封装的url 
const dataJson =util.getUrl('data.json');

4.在xxx.js 写下面代码

（1）onLoad(生命周期)：小程序注册完成后，加载页面，触发onLoad方法，一个页面只会调用一次

 // 在onLoad生命周期写接口数据
  onLoad() {

  //因为闭包了，所以需要改变this的指向
  let That=this;

  // 获取接口
  wx.request({
  //dataJson 是封装的接口
   url: 'dataJson',

    // 传给后台的数据
    data:{
      key:'123',
      userName:"小安"
    },

    // 接收后台的数据 (是That，不是this)That.setData... 
    success(res){
    That.setData({

      //进行赋值
      user:res.data.需要请求的数据名称（比如：接口数据里面的city）
    })
    }
  })



   //以下代码无关
    if (wx.getUserProfile) {
      this.setData({
        canIUseGetUserProfile: true
      })
    }
  },

5.在xxx.xwml 写下面代码

<!--使用插值语法把需要渲染到页面的数据写进去 -->
<text>
{{userName}}
</text>