鍍金池/ 問答/HTML/ 分頁條件查詢點擊下一頁后變成全部數(shù)據(jù)?

分頁條件查詢點擊下一頁后變成全部數(shù)據(jù)?

  1. 一個頁面有table表格, 里面有很多數(shù)據(jù), 有搜索框, 當點擊搜索的時候, 可以進行篩選, 但是點擊下一頁的時候, 數(shù)據(jù)變成全部的數(shù)據(jù), 分頁也跟著變了
  2. 以下是點擊搜索的時候篩選的數(shù)據(jù)

clipboard.png

3.當點擊下一頁的時候數(shù)據(jù)變成全部數(shù)據(jù)

clipboard.png

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: {
    // 植物數(shù)據(jù)
    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);
        });
    },

    // 分頁
    handleSizeChange(val) {},
    handleCurrentChange(pageNum) {
      this.query.currentPage = pageNum;
      this.wildPlantData();
    }
  },
  created() {
    this.wildPlantData();
    this.queryData();
  }
};
回答
編輯回答
萌面人

用開發(fā)者工具看看你請求的參數(shù),以及返回的數(shù)據(jù)

2017年10月18日 22:49