国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

Vue 實用分頁組件paging（頁數(shù)太多時顯示省略號）

andycall / 986人閱讀

摘要：年更新之前的版本在頁數(shù)太多時依然每一頁都顯示，這顯然不合理。增強版在頁數(shù)太多時會顯示省略號，且把分頁組件多帶帶提取出來，可以直接在其他頁面引入使用。用下來還是的做法方便一些，不需要繞一下子了?？傢摂?shù)當前頁頁面初始化函數(shù)參考文章

2017年6.26更新：

之前的版本在頁數(shù)太多時依然每一頁都顯示，這顯然不合理。增強版在頁數(shù)太多時會顯示省略號，且把分頁組件多帶帶提取出來，可以直接在其他頁面引入使用。代碼見： Paging.vue

也可以直接在JSfiddle中查看實現(xiàn)

—————————————下面是之前的版本————————————

直接上代碼。只有一個小小的需要注意的點：vue1.x的v-for循環(huán)是從0開始，遵從了程序語言設計的一貫的做法，而vue2.x是從1開始的，符合我們平常的習慣。用下來還是vue2.x的做法方便一些，不需要繞一下子了。

你也可以 直接在jsfiddle中查看 。

//html


prev

next

//js
var paging = new Vue({
  el: "#paging",
  data: {
    sum: 4, //總頁數(shù)
    curPage: 1, //當前頁
  },
  methods: {
    getBooks: function(page){
      //頁面初始化函數(shù)
    },
    switchPage: function(page){
      var vm = this;
      if(page < 1) {
        page = 1;
      } else if(page > vm.sum) {
        page = vm.sum;
      }
      vm.getBooks(page);
      vm.curPage = page;
    },
  }
})
//css
span {
  display: inline-block;
  margin: 3px;
  width: 35px;
  height: 35px;
  line-height: 35px;
  text-align: center;
  color: pink;
  background: #fff;
  border-radius: 5px;
}
span.current-page,
span:hover {
  color: #fff;
  background: pink;
}

參考文章：
https://segmentfault.com/a/11...

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/111867.html

相關(guān)文章

  • Vue 實用分頁組件paging（頁數(shù)太多時顯示省略號）

    摘要：年更新之前的版本在頁數(shù)太多時依然每一頁都顯示，這顯然不合理。增強版在頁數(shù)太多時會顯示省略號，且把分頁組件單獨提取出來，可以直接在其他頁面引入使用。用下來還是的做法方便一些，不需要繞一下子了。總頁數(shù)當前頁頁面初始化函數(shù)參考文章 2017年6.26更新： 之前的版本在頁數(shù)太多時依然每一頁都顯示，這顯然不合理。增強版在頁數(shù)太多時會顯示省略號，且把分頁組件單獨提取出來，可以直接在其他頁面引入使...

    cnio 評論0 收藏0

  • Vue 實用分頁組件paging（頁數(shù)太多時顯示省略號）

    摘要：年更新之前的版本在頁數(shù)太多時依然每一頁都顯示，這顯然不合理。增強版在頁數(shù)太多時會顯示省略號，且把分頁組件單獨提取出來，可以直接在其他頁面引入使用。用下來還是的做法方便一些，不需要繞一下子了。總頁數(shù)當前頁頁面初始化函數(shù)參考文章 2017年6.26更新： 之前的版本在頁數(shù)太多時依然每一頁都顯示，這顯然不合理。增強版在頁數(shù)太多時會顯示省略號，且把分頁組件單獨提取出來，可以直接在其他頁面引入使...

    ShevaKuilin 評論0 收藏0

  • 手把手教你用原生JavaScript造輪子（1）——分頁器（最后更新：Vue插件版本，本篇Over！

    摘要：使用構(gòu)造函數(shù)那么有沒有一種辦法，可以不寫函數(shù)名，直接聲明一個函數(shù)并自動調(diào)用它呢答案肯定的，那就是使用自執(zhí)行函數(shù)。 日常工作中經(jīng)常會發(fā)現(xiàn)有大量業(yè)務邏輯是重復的，而用別人的插件也不能完美解決一些定制化的需求，所以我決定把一些常用的組件抽離、封裝出來，形成一套自己的插件庫。同時，我將用這個教程系列記錄下每一個插件的開發(fā)過程，手把手教你如何一步一步去造出一套實用性、可復用性高的輪子。 So, ...

    CHENGKANG 評論0 收藏0

  • 一個通用的vue的表格組件

    摘要：在做業(yè)務組件的時候需要自己自己封裝一個通用的表格，這個表格需要符合我們一切的好的幻想，左右固定，表頭固定，分頁，選擇，一直表格內(nèi)容的行數(shù)限制等等，下面就為大家介紹一下這一款表格組件功能以及怎么使用。 在做業(yè)務組件的時候需要自己自己封裝一個通用的表格，這個表格需要符合我們一切的好的幻想，左右固定，表頭固定，分頁，選擇，一直表格內(nèi)容的行數(shù)限制等等，下面就為大家介紹一下這一款表格組件功能以及...

    caoym 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<