文章

首页服务随机获取展示功能的实现

一.内容概述

在我的微信小程序构想中,对于首页有一个功能是很有必要实现的。

那就是:首页随机获取服务项目信息展示,并且不仅要能展示,也要能够点击跳转到对应的服务详情界面。

\

\

二.逻辑实现

后端代码如下:

@GetMapping("/random")
    @ApiOperation("随机查询")
    public ResponseResult<List<Program>> random(){

        Integer pageSize = 4;

        Integer count = Math.toIntExact(programService.count());
        Integer x = count / pageSize;
        Random rand = new Random();
        Integer randNumber = rand.nextInt(x - 1 + 1) + 1;
        Page<Program> programPage = new Page<>(randNumber,pageSize);
        List<Program> list = programService.page(programPage).getRecords();
        return ResponseResult.success(list);
    }

虽然说是随机查询,但是和常见的随机查询稍有不同。

在这里的查询构想我设定为将我program表里所有项目全部获取,并且按照一页分为四个的形式读出。

逻辑上的体现为:

定义好了一页展示总量-->pageSize=4

将项目表总项目数量的获取-->count

两数相除可以得到总的可以展示的页数-->x=count / pageSize

然后在1到x中随机获取一个数字,并利用这个随机数(randNumber )和页码大小(pageSize )生成一个page对象(programPage )。

然后再通过封装好的page方法获取page对象里的项目列表

最后将获取到的列表返回给微信端以用来展示。

微信端代码如下:

  onLoad(){
    let user = wx.getStorageSync('user')
    let that = this
    wx.request({
      url: 'http://localhost:11000/api/program/random', //仅为示例,并非真实的接口地址
      method:'get',
      header: {
        'content-type': 'application/json', // 默认值
        'token':user.token
      },
      success (res) {
        that.setData({
          list:res.data.data
        })
        console.log(res.data)
      }
    })
  },

微信端代码没什么可说的,一个简单的wx:request(),然后将返回体中我们需要的数据存储进入list这个列表中以用以前端页面展示。

License:  CC BY 4.0