大家好，今天我將給大家聊聊分頁的問題。數據分頁是任何項目中都會用到的功能，在講這個問題的時候，我也特意從網上搜索了一下，各種答案都有，有的網友為了寫個分頁組件，需要加載很多文件，比如用bootstrap寫的組件，就需要加載bootstrap.min.css、字體等等，這種做法只會讓分頁臃腫，不利于代碼復用。網上還有其他類型的分頁代碼，總感覺不盡人意，沒辦法，我只能親自操刀。現在我把代碼分析出來，希望對大家有用。
一、創建分頁組件（page.vue）
下面我就把代碼截圖給大家看，只要按照這種方式寫就不會有問題，如圖所示：
第一頁
第二頁
以上就是分頁的全部代碼，是不是很簡單，任何人都能寫出來。下面我們來看看在頁面中如何使用它。
二、如何使用分頁？
1、在需要的頁面中引用分頁
1、實例組件
3、在代碼中嵌入組件
說明："this.$fetch"是我寫好的公共方法：具體請看“在Vue中如何使用axios跨域訪問數據”一文
整體代碼如下圖所示：
四、后臺接口展示
$this->resData('','','')方法如下：
順便提一下，所有的接口，我們都是用Thinkphp5寫的，如果不熟悉TP5的小伙伴們，需要惡補一下啦。頁面最終的效果如下：
以上就是我在項目中使用的分頁，不清楚的小伙伴們可以聯系我們，我們將竭誠為您服務。
下一章我們將奉上“在Vue中如何上傳 圖片”，這是我自己寫的圖片上傳組件，大家可用拿來就用。
為了更好的服務大家，請加入我們的技術交流群：（511387930），同時您也可以掃描下方的二維碼關注我們的公眾號，每天我們都會分享經驗，謝謝大家。
