基于vue實現分頁/翻頁組件paginator

xuexiangjys 發布于2019-08-21 11:31 / 1409人閱讀

摘要：項目背景做列表頁時不可避免會用到分頁親愛的們啊現在發放福利嘍直接安裝使用還有木有更方便的了哈哈這是一個基于的組件話不多說直接開擼地址當頁數小于包括頁頁數大于頁首頁或尾頁頁之內顯示正在研究怎么做出一個發布到網上后續會發地址安裝傳

項目背景

做列表頁時,不可避免會用到分頁,親愛的們啊,現在發放福利嘍!
npm直接安裝使用,還有木有更方便的了,O(∩_∩)O哈哈~
這是一個基于vue的paginator組件,話不多說,直接開擼github地址: vue-paginator-simple

demo img

當頁數小于999(包括999)頁

頁數大于999頁

首頁或尾頁disabled

10頁之內顯示

正在研究怎么做出一個demo發布到網上,后續會發demo地址

npm安裝

npm install vue-paginator-simple --save-dev

Props傳參

pageCount //總頁數

[initPage] //初始頁,選填(場景舉例: URL直接指向第三頁)

Event監聽事件

@togglePage //切換頁面,本組件會返回當前點擊的頁數

Usage用法

Code源碼 vue-paginator-simple 分頁組件 paginator.vue

云服務器 GPU云服務器 Vue實現分頁 pagination分頁 vue組件 vue組件開發

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/86810.html

Graphql實踐——像axios一樣使用Graphql

摘要：初始化項目使用初始化項目安裝項目結構如下接口所有接口對封裝接下來對進行封裝，加上中間件實現類似于攔截器的效果。 Graphql嘗鮮在只學習graphql client端知識的過程中，我們常常需要一個graphql ide來提示graphql語法，以及實現graphql的server端來進行練手。graphql社區提供了graphiql讓我們使用 graphiql (npm)：一個交互...

mumumu 2019-08-22 18:24 評論0 收藏0
基于vue實現swipe輪播組件

摘要：項目背景圖片輪播是前端項目必有項，當前有很多效果很酷炫的輪播插件，例如。此處應該有掌聲，哈哈簡而言之，就是當需要一個簡單的輪播時，可以選用，自己寫一個組件。舉個栗子，就是我實現的這個基于實現分頁組件，移動端和端均適用哦。項目背景圖片輪播是前端項目必有項，當前有很多效果很酷炫的輪播插件，例如Swiper。但是當項目中的圖片輪播只需要一個很簡單的輪播樣式，比如這樣的showImg(ht...

Enlightenment 2019-08-22 10:42 評論0 收藏0
基于 Vue 實現的移動端圖片輪播組件.

摘要：基于的移動端的圖片輪播組件之前一直在用功能很齊全但是唯一的問題就是體積比較大我只是想要一個簡單的圖片輪播但是卻要引入多大小的文件這樣是不對的特點支持自動播放無限輪播效果支持用戶手動滑動壓縮后大概使用在入口文件中引入暫時不支持單組 wc-swiper 基于 Vue 的移動端的圖片輪播組件. why 之前一直在用 vue-awesome-swiper, 功能很齊全, 但是唯一的問題就是體積...

hsluoyz 2019-08-20 18:52 評論0 收藏0
Web 前端單元測試到底要怎么寫？看這一篇就夠了

摘要：隨著應用的復雜程度越來越高，很多公司越來越重視前端單元測試。最后我們可以利用覆蓋率來看下用例的覆蓋程度是否足夠一般來說不用刻意追求，根據實際情況來定單元測試是測試驅動開發的基礎。隨著 Web 應用的復雜程度越來越高，很多公司越來越重視前端單元測試。我們看到的大多數教程都會講單元測試的重要性、一些有代表性的測試框架 api 怎么使用，但在實際項目中單元測試要怎么下手？測試用例應該包含哪...

lastSeries 2019-08-23 10:49 評論0 收藏0