基於jQuery的分頁插件很多,今天分享一下基於Vue的分頁插件pagination.js,該插件使用用感覺很不錯,簡單不復雜,現將個人使用過程中的方法與遇到的問題以及實例分享出來。
下載解壓的主要目錄是:
Vue_Pagination_demo.html可以直接打開查看UI
Vue_Pagination的使用
1.首先分析插件需要的組件
vue.js 、zpageNav.css、zpageNav.js
2.在頁面中導入相應的文件
3.組件上屬性配置
此時注意 若因為數據返回的key需要自行修改插件,標簽上屬性的綁定名要按照圖中 不能識別駝峰,小寫字母加‘-’,不然會報錯
如圖是我因為這邊返回的key而做的改動,可能大家都知道,只是做一個提醒
4.編寫js,vue的方法
上圖以及案例中都已經有注釋,在此貼出我實際使用案例,為方便理解,用了JQ的ajax
5.當然也可以用vue-resource
6.UI展示
點擊下載 百度網盤 鏈接:https://pan.baidu.com/s/1X3XeLabWLP0frpKn_KUs_g 密碼:geey