;
一下是element ui 元件裡面的乙個**
:data=
"showlist.slice((currpage - 1) * pagesize, currpage * pagesize)"
style=
"width: 1000px"
>
"expand"
>
"props"
>
"left" inline class
="demo-table-expand"
>
"商品名稱"
>
}<
/span>
<
/el-form-item>
"所屬店鋪"
>
}<
/span>
<
/el-form-item>
"商品 id"
>
}<
/span>
<
/el-form-item>
"商品分類"
>
}<
/span>
<
/el-form-item>
"店鋪位址"
>
}<
/span>
<
/el-form-item>
"商品描述"
>
}<
/span>
<
/el-form-item>
<
/el-form>
<
/template>
<
/el-table-column>
"店鋪名稱" prop=
"name"
>
<
/el-table-column>
"店鋪位址" prop=
"address"
>
<
/el-table-column>
"店鋪介紹" prop=
"description"
>
<
/el-table-column>
"操作"
>
"scope"
>
size=
"mini"
type=
"danger"
@click=
"dele(scope.$index, scope.row)"
>
刪除<
/el-button>
<
/template>
<
/el-table-column>
<
/el-table>
分頁器
='block'
>
background
@size-change=
"handlesizechange"
@current-change=
"handlecurrentchange"
:current-page=
"currentpage"
:page-sizes=
"[5, 10, 20, 40]"
:page-size=
"pagesize"
layout=
"total, sizes, prev, pager, next, jumper"
:total=
"tabledata.length"
>
<
/el-pagination>
<
/div>
export
}， methods:
, handlecurrentchange:
function
(currentpage),}
,}
.block >>> button,
.block >>> .el-pager li
.block >>> .el-pagination.is-background .el-pager li:not(.disabled).active
Element UI 的分頁元件
sizechange size 當使用者單擊任意頁碼或實現頁面跳轉時會觸發current page屬性的變化。currentchange current 擷取頁數 woekeralldata.slice pagenumber currentchangeindex 1 pagenumber curre...
elementUI分頁元件封裝
在實際開發需求，產品需要的分頁元件比較簡單，只可以一頁頁地翻，就是為了防止用於直接翻看最後的資料 因為有一些歷史資料資料量比較大，檢視的意義不大，檢索效率比較低也比較忙，因為不希望使用者在翻頁的時候可以隨意翻看很久之前的資料 因此需要根據實際需求進行分頁元件封裝 以下封裝的分頁元件，勉強夠用，但是還...
ElementUI 分頁元件二次封裝
更新記錄 改善了呼叫方式，僅需傳入分頁物件與繫結查詢事件。改為通過 model 更新分頁物件。修復了ie下，輸入頁碼回車會觸發整個頁面重新整理問題 呼叫方式 pager pager query getitemlist template import pagingquery from componen...