vue-page分頁組件,h5或者腳手架中通用


每次在h5頁中用vue.js時,會碰到一些平嘗UI庫里的插件效果(比如分頁),由於頁面內容不多,感覺引入一個UI庫有點浪費,手寫又來不及,特閑暇時封裝來用,樣式如下(樣式 可修改):

本組件是在h5中自定義的template實現,如下:

所以只需要將當前js引入到html並放在vue下面即可。

HTML中使用方法:

<page-list :totalpage='80' :jumppage="true" @clickpages='clickpages'></page-list>
//totalpage:總共有多少頁 jumppage:是否展示跳轉輸入框 clickpages:點擊分頁后的回調

在vue中的注冊方法:

new Vue({
  el: '#app',
  components: {
    'page-list': pageList
  },
  methods: {
    clickpages(num) {
      console.log(num)
    }
  }
})

注:當前組件必須再 el 綁定的元素中使用。

下載地址:https://files-cdn.cnblogs.com/files/caoxiaokang/page-rar.zip

git源碼地址:https://github.com/173269537121/vue-page.git


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM