[移动开发]wx小程序+springboot发请求，加载更多

发表单实体类
小程序js代码
POST请求

		var that = this.data
		wx.request({
            url: 'http://localhost:8080/article/insert', //仅为示例，并非真实的接口地址
            method: "POST",
            data: {    
                title: that.title,
                acontent: that.acontent,
                date: that.adate,
                alikeNums: that.alikeNums,
                imgUrl: that.imgUrl,
                userID: that.userId,
                userName: that.userName
            },
            header: {
                'content-type': 'application/json' // post请求加这个才会对数据进行 JSON 序列化
            },
            success(res) {
                console.log(res.data)
            }
        })

springboot的
实体类
article.java

package com.wx.wdcysh.domain;


import java.sql.Date;

public class Article {
    private Integer articleId;
    private String title;
    private String acontent;
    private Date date;
    private Integer alikeNums;
    private String imgUrl;
    private String userID;
    private String userName;

    public Integer getArticleId() {
        return articleId;
    }

    public void setArticleId(Integer articleId) {
        this.articleId = articleId;
    }

    public String getTitle() {
        return title;
    }

    public void setTitle(String title) {
        this.title = title;
    }

    public String getAcontent() {
        return acontent;
    }

    public void setAcontent(String acontent) {
        this.acontent = acontent;
    }

    public Date getDate() {
        return date;
    }

    public void setDate(Date date) {
        this.date = date;
    }

    public Integer getAlikeNums() {
        return alikeNums;
    }

    public void setAlikeNums(Integer alikeNums) {
        this.alikeNums = alikeNums;
    }

    public String getImgUrl() {
        return imgUrl;
    }

    public void setImgUrl(String imgUrl) {
        this.imgUrl = imgUrl;
    }

    public String getUserID() {
        return userID;
    }

    public void setUserID(String userID) {
        this.userID = userID;
    }

    public String getUserName() {
        return userName;
    }

    public void setUserName(String userName) {
        this.userName = userName;
    }

    @Override
    public String toString() {
        return "Article{" +
                "articleId=" + articleId +
                ", title='" + title + '\'' +
                ", acontent='" + acontent + '\'' +
                ", date=" + date +
                ", alikeNums=" + alikeNums +
                ", imgUrl='" + imgUrl + '\'' +
                ", userID='" + userID + '\'' +
                ", userName='" + userName + '\'' +
                '}';
    }
}

controller层

@Controller
@RequestMapping("/article")
public class ArticleController {
    @RequestMapping("/insert")
    @ResponseBody
    public String selectAll(@RequestBody Article article){
        System.out.println(article.toString());
        return "上传成功"
    }
}

GET请求

		var that = this.data
        wx.request({
            url: 'http://localhost:8080/article/insert', //仅为示例，并非真实的接口地址
            // method: "POST",
            data: {
                title: that.title,
                acontent: that.acontent,
                date: that.adate,
                alikeNums: that.alikeNums,
                imgUrl: that.imgUrl,
                userID: that.userId,
                userName: that.userName
            },
            success(res) {
                console.log(res.data)
            }
        })

@Controller
@RequestMapping("/article")
public class ArticleController {
    @RequestMapping("/insert")
    @ResponseBody
    public String selectAll(Article article){
        System.out.println(article.toString());
        return "上传成功";
    }
}

wx小程序+springboot+mybait加载更多功能，发几个变量
小程序js代码

var isEnd = false
var currentPage = 1
Page({

  /**
   * 页面的初始数据
   */
  data: {
    loading:false,
    loadMoreText:'加载更多',
    newsList:[]
  },
  //跳转新页面浏览新闻内容
  goToDetail:function(e){
    //console.log("sbhgfn"+e);不能一个字符串+上一个对象，这样js会自动进行隐式转换调用object里面的tostring方法
    //console.log("sbhgfn",e);
    let id = e.currentTarget.dataset.id
    common.goToDetail(id)
  },
  //加载更多新闻
  loadMore:function(){
    //如果新闻尚未全部加载完毕，并且按钮不在加载状态中
    if(!isEnd&&!this.data.loading){
      this.setData({
        loading:true
      })

      //加载时长
      setTimeout(()=>{
        this.getNewsListByPage(currentPage)
        this.setData({
          loading:false
        })
      },1000)
    }
  },
  //获取指定页面的新闻数据
  getNewsListByPage:function(page){
    var that = this
    //向服务器发送请求
    wx.request({
      url: common.getNewsList,
      data:{
        page:page
      },
      success:function(res){
         //console.log(res);
        //获取新闻总数
        let total = res.data.total
        //追加更多新闻
        let list = that.data.newsList.concat(res.data.list)
        //更新新闻数据和新闻总数
        that.setData({
          total:total,
          newsList:list
        })
        //如果已经显示全部新闻
        if(list.length == total){
          isEnd = true
          that.setData({
            loadMoreText:'已无更多'
          })
        }else{
          currentPage++
        }
      }
    })
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    //获取第一页新闻
    this.getNewsListByPage(1)
  }
})

wxml代码

<!--index.wxml-->
<!-- 幻灯片滚动效果 -->
<swiper indicator-dots autoplay interval="5000" duration="500">
  <block wx:for="{{[newsList[0],newsList[1],newsList[2]]}}" wx:key="swiper{{index}}">
    <swiper-item>
      <image src="{{item.poster}}" class="slide-image" />
    </swiper-item>
  </block>
</swiper>

<!-- 新闻列表 -->
<view id="news-list">
 <view class="list-item" wx:for="{{newsList}}" wx:for-item="news" wx:key="{{news.id}}">
    <image src="{{news.poster}}" ></image>
    <text bindtap="goToDetail" data-id="{{news.id}}" id="{{news.id}}">{{news.id}}◇ {{news.title}}————{{news.add_date}}</text>
 </view>

 <button plain loading="{{loading}}" bindtap="loadMore">{{loadMoreText}}</button>

</view>

springboot代码
mapper

//查询总数
    @Select("SELECT count(id) n FROM campus_news")
    public Integer findCount();
    //根据页数查询
    @Select("SELECT id,title,add_date,poster from campus_news limit ${(page - 1) * rows} , #{rows}")
    public List<News> findPage(Integer page,Integer rows);

实体类
News

package com.example.news.domain;


public class News {
    private Integer id;
    private String title;
    private String add_date;
    private String poster;
    private String content;

    public Integer getId() {
        return id;
    }

    public void setId(Integer id) {
        this.id = id;
    }

    public String getTitle() {
        return title;
    }

    public void setTitle(String title) {
        this.title = title;
    }

    public String getAdd_date() {
        return add_date;
    }

    public void setAdd_date(String add_date) {
        this.add_date = add_date;
    }

    public String getPoster() {
        return poster;
    }

    public void setPoster(String poster) {
        this.poster = poster;
    }

    public String getContent() {
        return content;
    }

    public void setContent(String content) {
        this.content = content;
    }

    @Override
    public String toString() {
        return "News{" +
                "id=" + id +
                ", title='" + title + '\'' +
                ", add_date=" + add_date +
                ", poster='" + poster + '\'' +
                ", content='" + content + '\'' +
                '}';
    }
}

NewsList

package com.example.news.domain;

import java.util.List;

public class NewsList {
    private Integer total;
    private List<News> list;

    public Integer getTotal() {
        return total;
    }

    public void setTotal(Integer total) {
        this.total = total;
    }

    public List<News> getList() {
        return list;
    }

    public void setList(List<News> list) {
        this.list = list;
    }
}

controller层

@Controller
@RequestMapping("/myNews/Index")
public class NewController {
    @Autowired
    private NewsMapper newsMapper;

    @GetMapping("/getNewsList")
    @ResponseBody
    public NewsList getNewsList(@RequestParam("page")Integer page){
        NewsList newsList = new NewsList();
        Integer sum = newsMapper.findCount();
        newsList.setTotal(sum);
        List<News> newsPageList = newsMapper.findPage(page,5);
        newsList.setList(newsPageList);
        return newsList;
    }
  }