elementUI 페이지 나누기 방법
4498 단어 vue.js
<div class="block">
<el-pagination layout="prev, pager, next" :total="total" :current-page.sync="currentPage"
:page-size="pageSize">
el-pagination>
div>
<div class="newList-list" v-if="(!isloading) && (arrData.length === 0)"> div>
<div class="newList-list" v-if="isloading"> ... div>
데이터
data() {
return {
arrData: [],
area: '', //
total: 0, //
pageNum: 1, //
pageSize: 6, //
isloading: false,
currentPage: 1,
};
},
watch
watch: {
currentPage(oldV, newV) {
console.log(oldV, newV);
this.exchangeCurrentPage();
}
},
methods
methods: {
//
getData() {
this.$http.get('//integral' + this.$getHost() + '/enterpriseInfo/queryEnterpriseList.json',
{
params: {
pageSize: this.pageSize,
pageNum: this.currentPage
}
}
).then((res) => {
if (res.data.status === 0) {
this.isloading = false;
this.arrData = res.data.datas;
res.data.datas.forEach((element) => {
this.area = element.area.split(',');
});
this.total = res.data.total; //
console.log(this.total);
}
});
},
exchangeCurrentPage() {
this.arrData = [];
this.isloading = true;
this.getData();
}
}
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
[백견불여일타/Vue.js] 4장 - 입력 폼 데이터 가져오기v-model 데이터 입력 select 지난 장에서는 v-bind를 이용해서 HTML 태그 속성 값을 Vue로 다루는 법을 배웠습니다. 이번에는 사용자가 입력한 데이터를 Vue로 가져오는 법에 대해 다룹니다. 웹 페...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.