内容概述

今天我要为我的小程序实现一个小功能：对于具体服务项目的抢购操作。

因为只是一个毕设，所以正儿八经的支付功能就不去实现了，只需要在对应界面点击立即抢购即可以在后端生成对应的订单数据，然后将对应订单数据返回给微信端用于我的订单展示。

订单页面如下：

逻辑实现

2.1 立即抢购

依旧首先展示代码

微信端代码如下：

  showSuccessMessage() {
    wx.request({
      url: 'http://localhost:11000/api/order',
      method:'post',
      header: {
                'content-type': 'application/json', // 默认值
                'token':u.token
              },
      data:{
        userId:u.id,
        price:this.data.program.price,
        programId:this.data.program.id
      },
      success(res){
          if(res.data.code == 200){
            Message.success({
              context: this,
              offset: [20, 32],
              duration: 3000,
              content:'恭喜您抢购成功！',
            });
        }
      }    
    })
  },

总的来说就是在点击按钮之后发送一个请求给后端，携带的数据为本页面展示的项目价格，项目id和userid三个，然后经过后端逻辑的处理给予一个返回值。如果返回值的code值为200则代表成功传输数据，然后就在微信端界面弹出提示信息。

后端代码展示：

@PostMapping
    @ApiOperation("添加订单")
    public ResponseResult add(@RequestBody Orders order){
        Boolean add = orderService.save(order);
        if(!add){
            throw new CustomException(60001,"订单添加失败！！");
        }
        return ResponseResult.success();
    }

后端则是一个很简单的增加方法，需要接受一个order对象，这个order对象包含的属性明显多于我们传入的数据量，可是即使如此也能当作一个order对象使用，因为毕竟我们没限制order的全部对象不能为空。

使用提前封装好的增加函数将order存入数据库并返回一个bool值，若成功则返回正确信息，若失败则返回错误log。

在微信端我们发出的请求也是标准格式：指定请求地址，请求方法，请求头，以及具体的数据。

请求数据也是通过键值对的方式：：：：》数据库中属性名：需要传入的数据（本界面的data申明里的program.id和program.price以及从本地存储器中获取到的用户id）。

请求成功之后，微信端收到的返回体一大坨，我们需要在其中找寻我们需要的信息。比如返回数据的code，用来判断是否真正成功

若code=200则代表添加成功，弹出抢购成功提示消息。

2.2我的订单

少废话，上代码：

onShow() {
    let that = this;
    wx.request({
      url: 'http://localhost:11000/api/order?userId='+u.id+'&size=9999',
      method:'get',
      header: {
                'content-type': 'application/json', // 默认值
                'token':u.token
              },
        success (res) {
                  that.setData({
                    order:res.data.data
                  })
            console.log(res.data);
        },
        fail(err){
                      console.log(err);
                    }
    })
  },

在我的订单界面我们选择在onShow()界面发送请求，即页面每次展示的时候，这涉及到微信页面的生命周期问题，这里不过多概述。

这里和之前稍有不同的是请求地址的填写方式：

url: 'http://localhost:11000/api/order?userId='+u.id+'&size=9999',

因为在后端代码查询中我们可以使用多种信息查询的方式，所以在这里我们可以指定多种查询条件，且切记第一个插入的信息前必须是？后边每一个都是&。

且写在单引号里边的是静态不可变的，如这里的size=9999，想要动态查询就必须把动态的东西写在单引号外，比如这里的u.id。

PS：size是我们指定一个页面可以展示多少个订单信息的参数。

获取成功则将订单信息放入我们提前申明好的微信端的order对象里。

至此我们则可以在MyOrder界面展示所有订单表所拥有的信息了。

举例如下：（将标题展示为所订购项目id）