其他分享
首页 > 其他分享> > element UI 数据修改后要停留在当前页

element UI 数据修改后要停留在当前页

作者:互联网

element UI 修改后停留在当前页

<div class="pagination-panel">
					<el-pagination :page-sizes="[10, 20, 30, 100]" 
						:page-size="pageSize" 
						:current-page="pageIndex" 
						layout="total, sizes, prev, pager, next, jumper" 
						:total="acticletotalItem" 
						@size-change="handleSizeChange" 
						@current-change="handleCurrentChange">
					</el-pagination>
				</div>
handleSizeChange(val) {
				this.pageSize = val;
				sessionStorage.setItem("messageSize",val);
				this.getActicleList();
			},
			handleCurrentChange(val) {
				this.pageIndex = val;
				console.log(this.pageIndex);
				//将当前页码数保存到sessionStorage中
				sessionStorage.setItem("messagePage", val);
				this.getActicleList();
			},	

method中的created()

created() {				
			//取出当前页值
			this.allMessPag = sessionStorage.getItem("messagePage");
				if (this.allMessPag != undefined) {
				this.pageIndex = Number(this.allMessPag);
				console.log(this.pageIndex);
		         }
			//取出每页显示记录数
			this.allMessSize = sessionStorage.getItem("messageSize");
				if (this.allMessSize != undefined) {
				this.pageSize = Number(this.allMessSize);
				console.log(this.pageSize);
			     }		 
			this.getActicleList();
			this.getproductclassifyList();
			//移除当前页
			//sessionStorage.removeItem("messagePage");			
		}

方法二:直接修改

直接向后端传递当前页

// 初始化
    init() {
      this.page_index = this.page_index;
			this.getData();
    }

标签:pageIndex,pageSize,val,getActicleList,后要,当前页,UI,sessionStorage
来源: https://blog.csdn.net/weixin_47572542/article/details/113844396