标签：pageNum 分页 val res element currentPage 第几页 pageSize

element的分页器,相对于替换代码

html

            <!-- 分页器 -->
            <div class="block">
              <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="currentPage"
                :page-sizes="[2, 4, 8, 9]"
                :page-size="2"
                layout="total, sizes, prev, pager, next, jumper"
                :total="totalNum"
              >
              </el-pagination>

js

    return {
      totalNum: 0, //总条数
      currentPage:1, //当前是第几页
      pageNum:2,//一页多少条数据
    }
  methods: {
    // 每页显示多少条,触发
    handleSizeChange(val) {
      // 每页显示多少条
      this.pageNum = val
      this.__init(this.pageNum,this.currentPage)
    },

    // 第几页,触发
    handleCurrentChange(val) {
      // 第几页
      this.currentPage = val
      this.__init(this.pageNum,this.currentPage)
    },

    // 初始化数据 1 : 一页显示多少条 , 2 : 第几页
    __init(pageSize, pageNum) {
      request
        .$axios({
          url: "/querstion/list",
          data: {
            pageSize:pageSize, //一页显示多少条
            pageNum: pageNum,  //第几页         
          },
        })
        .then((res) => {
          this.tableData = res.data.questionnaireList;
          this.totalNum = res.data.total; //总条数
          console.log(res);
        });
    },
}

标签：pageNum,分页,val,res,element,currentPage,第几页,pageSize
来源： https://www.cnblogs.com/qd-lbxx/p/15832679.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。