6-请求接口

一、请求接口

在 index.js 中:

data: {
    city:""  //定义变量存后台的数据
},
onLoad: function () {
let that = this;  //不能直接使用this,因为闭包了
  wx.request({
      url: 'https://ehcto.com/data.json',   //请求路径
      data:{
        key: "123",   //给后台传的值
        userName: "张三"
      },
      seccess(res) {
        console.log(res.data)   //后台返回的数据
        that.setData({
          city:res.data.city
        })
     }
  })
}

在 index.wxml 中:

<text>{{city}}</text>

⚠️微信小程序几乎所有的API接口都会有success, fail, complete三个回调函数来处理业务的后续逻辑,很多时候我们要获取当前页面对象来对视图进行渲染。当我们想要获取页面的初始数据 data时候,在回调函数里面就不能使用 this.data来获取,同样的就不能使用this.setData()函数来渲染视图。我们需要做的就是在把我们想要的this对象想复制到that。

二、封装URL

一般在请求的时候不直接写https://ehcto.com/data.json ,会把前半部分封装到工具类中,因为前半部分相同,封装起来以后用起来会方便很多。
util.js(或者在util文件夹下新建一个js文件)

let url = "https://echto.com/";
const getUrl = function(data){   //
  return url + data
}

module.exports = {  //抛出方法
  formatTime: formatTime,
  getUrl:getUrl
}

在需要使用请求的.js文件里:

const util = require("../../utils/util.js")   //引入函数
const requestUrl = util.getUrl("data.json");  //调用 
//https://ehcto.com/data.json

//在request 请求的时候路径可以直接写requestUrl变量名
let That = this;
wx.request({
  url:requestUrl,
  data:{
    key: "123",   //给后台传的值
    userName: "张三"
 },
seccess(res) {
    console.log(res.data)   //后台返回的数据
    That.setData({
       city:res.data.city   //赋值
   })
  }
})

️只能请求域名信息里边有的地址

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 概要 64学时 3.5学分 章节安排 电子商务网站概况 HTML5+CSS3 JavaScript Node 电子...
    阿啊阿吖丁阅读 9,350评论 0 3
  • Swift1> Swift和OC的区别1.1> Swift没有地址/指针的概念1.2> 泛型1.3> 类型严谨 对...
    cosWriter阅读 11,150评论 1 32
  • ORA-00001: 违反唯一约束条件 (.) 错误说明:当在唯一索引所对应的列上键入重复值时,会触发此异常。 O...
    我想起个好名字阅读 5,455评论 0 9
  • ¥开启¥ 【iAPP实现进入界面执行逐一显】 〖2017-08-25 15:22:14〗 《//首先开一个线程,因...
    小菜c阅读 6,593评论 0 17
  • 33、JS中的本地存储 把一些信息存储在当前浏览器指定域下的某一个地方(存储到物理硬盘中)1、不能跨浏览器传输:在...
    萌妹撒阅读 2,121评论 0 2