如何使用分頁器元件封裝

1.首先我們先定義乙個子元件來封裝乙個分頁器元件

這個是element ui 中的分頁器

@current-change

="handlecurrentchange"
layout
="prev, pager, next, jumper"
:total
="list.data.total"
>
el-pagination
>

使用元件封裝的方法請求資料然後賦值給一條資料

const  = await good(this.forms);

this.list = data
:list
="list"
>
pagination
>

使用props來接收父元件傳過來的的資料

props:[

"list"
],//將資料放入分頁器的條數中
:total="list.data.total"
這裡是將條數寫入到分頁器的方法
@current-change
="handlecurrentchange"
layout
="prev, pager, next, jumper"
:total
="list.data.total"
>

handlecurrentchange(val)

這裡是重新請求資料

async fenye(val),

vue element分頁器元件封裝

分頁元件 分頁元件的封裝 pagination size change sizechange current change currentchange page sizes 1,5,10 layout total,sizes,prev,pager,next,jumper current page.s...

Vue封裝分頁元件

使用vue做雙向繫結的時候，可能經常會用到分頁功能 接下來我們來封裝乙個分頁元件 先定義樣式檔案 pagination.css ul,li page bar page button disabled page bar li page bar li first child a page bar a p...

封裝element分頁元件

將 element ui 中分頁封裝成公共元件 admin後台中會有很多的 以及分頁的應用，所以考慮將分頁分裝成公共元件 封裝元件 vue頁面 background background current page.sync currentpage page size.sync pagesize la...