Vue Bootstrap分頁是一個用于Vue.js的組件，用于幫助用戶制作友好的分頁界面。它是基于Bootstrap的樣式和JavaScript組件，提供了各種可定制的選項和事件，以幫助更好地適應不同的應用程序需求。

使用Vue Bootstrap分頁非常容易。首先，您需要安裝并引入Vue Bootstrap分頁組件。您可以使用npm或yarn進行安裝：

npm install vue-bootstrap-pagination

yarn add vue-bootstrap-pagination

安裝后，您需要將分頁組件注冊到您的Vue應用程序中。您可以在Vue組件，模板或其他單文件組件中這樣做：

import Pagination from 'vue-bootstrap-pagination';
export default {
components: {
Pagination,
},
// 省略其他代碼
}

您可以在模板中使用<pagination>標簽來創建一個分頁：

<pagination :total-page="50" v-model="currentPage"></pagination>

該:total-page屬性表示總頁數，而v-model表示當前所在頁數。當您切換頁數時，v-model會自動更新。

為了更好地適應不同的應用程序需求，Vue Bootstrap分頁還提供了更多定制選項。例如，您可以通過更改size屬性來更改分頁按鈕的大小：

<pagination
:total-page="50"
v-model="currentPage"
size="lg"
></pagination>

還可以使用各種事件來執行特定的操作。例如，您可以使用@change-page事件來在分頁更改時執行特定的操作：

<pagination
:total-page="50"
v-model="currentPage"
size="lg"
@change-page="onPageChange"
></pagination>

在您的Vue組件中，您可以實現該onPageChange方法來執行所需的操作：

methods: {
onPageChange(page) {
// do something when page is changed
},
// 省略其他代碼
}

總之，Vue Bootstrap分頁是一種非常靈活且易于使用的組件，可幫助您制作友好的分頁界面。通過使用Vue組件的優點，您可以更輕松地管理和維護分頁代碼。試試看吧！