在Web開發中，分頁是非常常見的功能。Vue作為一種前端框架，提供了很多便捷的方式來實現分頁的功能。下面我們來介紹一個Vue中分頁的案例。

首先，在HTML頁面中，我們需要定義分頁所需的數據：

<template>
<div>
<ul>
<li v-for="page in pages">
<a :class="{active: page===currentPage}" @click="changePage(page)">{{ page }}</a>
</li>
</ul>
</div>
</template>
<script>
export default {
data() {
return {
currentPage: 1,
pages: []
};
},
created() {
this.getPages();
},
methods: {
changePage(page) {
this.currentPage = page;
this.getPages();
},
getPages() {
//根據后臺返回的總頁數，計算需要顯示的頁碼
//這里以假數據為例
const totalPage = 10;
const showPage = 5;
let pages = [];
const middlePage = Math.ceil(showPage / 2);
let startPage = this.currentPage - middlePage + 1;
if (startPage< 1) {
startPage = 1;
}
let endPage = startPage + showPage - 1;
if (endPage >totalPage) {
endPage = totalPage;
}
for (let i = startPage; i<= endPage; i++) {
pages.push(i);
}
this.pages = pages;
}
}
};
</script>

上面的代碼中，我們定義了一個Vue組件，其中包括兩個數據屬性：currentPage和pages。currentPage表示當前頁碼，pages表示需要顯示的頁碼數目。在created生命周期中，我們調用了getPages方法來計算需要顯示的頁碼數。

接下來，我們定義了兩個方法：changePage和getPages。changePage方法用于切換當前頁碼，并重新計算需要顯示的頁碼數；getPages方法則計算需要顯示的頁碼數，并把頁碼存儲到pages屬性中。

在HTML頁面中，我們使用v-for指令來遍歷pages數組，然后通過:class指令來動態設置當前頁碼的樣式，使用@click指令來監聽頁碼的點擊事件。當點擊頁碼時，我們調用changePage方法來切換當前頁碼。

使用Vue實現分頁功能非常簡單，只需要在Vue組件中定義分頁所需的數據和方法，然后在HTML頁面中使用v-for指令遍歷數據即可。上面的代碼只是一個簡單的案例，如果我們要實現更復雜的分頁功能，只需要在getPages方法中根據需要實現計算即可。