微信小程序系列-调用本地接口

最新推荐文章于 2023-10-12 09:13:08 发布

原创最新推荐文章于 2023-10-12 09:13:08 发布 · 1.8k 阅读

1 ·

CC 4.0 BY-SA版权

微信小程序专栏收录该内容

55 篇文章

订阅专栏

本文详细介绍了如何使用微信Web接口获取库存数据，包括接口地址、返回的JSON数据格式及解析方法，展示了在JavaScript中发送请求并处理返回数据的示例。

本地接口地址为：http://119.146.220.205:8090/WeiXinWeb/?cType=CurrentStock&cInvCode=&cVenName=&copenId=

返回数据为json格式，如下：

[
    {
        "cInvCode": "YL242P",
        "cInvName": "瓷片系列",
        "cBatch": "HB46",
        "cInvStd": "300*600",
        "fYFroze": "9",
        "cVenName": "欧神诺陶瓷",
        "iQuantity": "9",
        "fKYQuantity": "0",
        "cPosName": "T0924",
        "cPosCode": "Z124",
        "cWhCode": "01"
    },
    {
        "cInvCode": "YL242P",
        "cInvName": "瓷片系列",
        "cBatch": "JAB48",
        "cInvStd": "300*600",
        "fYFroze": "961",
        "cVenName": "欧神诺陶瓷",
        "iQuantity": "1143",
        "fKYQuantity": "182",
        "cPosName": "C1",
        "cPosCode": "Z243",
        "cWhCode": "01"
    }
]

在请求数据的.js的onload方法中：

onLoad: function(options) {
    var that = this;
    wx.request({
      url: 'http://119.146.220.205:8090/WeiXinWeb/?cType=CurrentStock&cInvCode=&cVenName=&copenId=',
      header: {
        'content-type': 'application/json'
      },
      success: function(res) {
        var queryBean = res.data;
        that.setData({
          queryBean: queryBean
        })
      }
    })
  },

在需要接受数据的.wxml页面：

<view class="record" wx:for="{{ queryBean }}" wx:key=" ">
  <view class="under">
    <text class="time">商品</text>
    <text class="succerr">{{ item.cInvName }}<text class="detail">@{{item.cVenName}}</text> </text>
  </view>
</view>

请求接口参数设置：

属性	类型	默认值	是否必填	说明	支持版本
url	string		是	开发者服务器接口地址
data	string/object/ArrayBuffer		否	请求的参数
header	Object		否	设置请求的 header，header 中不能设置 Referer。 `content-type` 默认为 `application/json`
method	string	GET	否	HTTP 请求方法
dataType	string	json	否	返回的数据格式
responseType	string	text	否	响应的数据类型	>= 1.7.0
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）