分页条件查询点击下一页后变成全部数据?

  1. 一个页面有table表格, 里面有很多数据, 有搜索框, 当点击搜索的时候, 可以进行筛选, 但是点击下一页的时候, 数据变成全部的数据, 分页也跟着变了

  2. 以下是点击搜索的时候筛选的数据

https://img.mukewang.com/5c9ae5350001f69b08000351.jpg

3.当点击下一页的时候数据变成全部数据

https://img.mukewang.com/5c9ae5360001bce308000347.jpg

js

export default {

  data() {

    return {

      botanyData: [],

      activeName2: "first",

      query: {

        pageNum: 1,

        pageSize: 10,

        currentPage: 1,

        recordCount: 0

      },

      seek: {

        familyName: "",

        speciesName: "",

        genusName: ""

      },

      familyName: "",

      speciesName: "",

      genusName: ""

    };

  },

  methods: {

    // 植物数据

    wildPlantData() {

      this.$http

        .get(this.$api.wildPlant, {

          params: { pageNum: this.query.currentPage }

        })

        .then(res => {

          if (res.status == 200) {

            this.botanyData = res.data.data.pageBean.recordList;

            this.query.recordCount = res.data.data.pageBean.recordCount;

            this.query.pageSize = res.data.data.pageBean.pageSize;

            this.query.currentPage = res.data.data.pageBean.currentPage;

          } else {

            throw res.message;

          }

        })

        .catch(err => {

          console.log("wildPlantData有异常", err);

        });

    },


    // 查询

    queryData() {

      this.seek.familyName = this.familyName;

      this.seek.speciesName = this.speciesName;

      this.seek.genusName = this.genusName;

      this.$http

        .get(this.$api.wildPlant, { params: this.seek })

        .then(res => {

          if (res.status == 200) {

            this.botanyData = res.data.data.pageBean.recordList;

            this.query.recordCount = res.data.data.pageBean.recordCount;

            this.query.pageSize = res.data.data.pageBean.pageSize;

            this.query.currentPage = res.data.data.pageBean.currentPage;

          } else {

            throw res.message;

          }

        })

        .catch(err => {

          console.log("queryData有异常", err);

        });

    },


 https://img2.mukewang.com/5c9ae550000133c903420233.jpg

慕少森
浏览 1067回答 1
1回答

眼眸繁星

用开发者工具看看你请求的参数,以及返回的数据
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript