這篇文章將為大家詳細(xì)講解有關(guān)Python Django如何實(shí)現(xiàn)layui風(fēng)格+django分頁(yè)功能,小編覺(jué)得挺實(shí)用的,因此分享給大家做個(gè)參考,希望大家閱讀完這篇文章后可以有所收獲。
創(chuàng)新互聯(lián)公司成立于2013年,是專業(yè)互聯(lián)網(wǎng)技術(shù)服務(wù)公司,擁有項(xiàng)目網(wǎng)站設(shè)計(jì)制作、成都網(wǎng)站設(shè)計(jì)網(wǎng)站策劃,項(xiàng)目實(shí)施與項(xiàng)目整合能力。我們以讓每一個(gè)夢(mèng)想脫穎而出為使命,1280元隆安做網(wǎng)站,已為上家服務(wù),為隆安各地企業(yè)和個(gè)人服務(wù),聯(lián)系電話:13518219792第一步:首先定義一個(gè)視圖函數(shù),用于提供數(shù)據(jù),實(shí)現(xiàn)每頁(yè)顯示數(shù)據(jù)個(gè)數(shù),返回每頁(yè)請(qǐng)求數(shù)據(jù)
from django.shortcuts import render from django.core.paginator import Paginator # Django內(nèi)置分頁(yè)功能模塊 def index(request): # 提供json數(shù)據(jù) resp = {"id":10000,"username":"user-0","sex":"女","city":"城市-0","sign":"簽名-0","experience":255,"logins":24,"wealth":82830700,"classify":"作家","score":57},{"id":10001,"username":"user-1","sex":"男","city":"城市-1","sign":"簽名-1","experience":884,"logins":58,"wealth":64928690,"classify":"詞人","score":27},{"id":10002,"username":"user-2","sex":"女","city":"城市-2","sign":"簽名-2","experience":650,"logins":77,"wealth":6298078,"classify":"醬油","score":31},{"id":10003,"username":"user-3","sex":"女","city":"城市-3","sign":"簽名-3","experience":362,"logins":157,"wealth":37117017,"classify":"詩(shī)人","score":68},{"id":10004,"username":"user-4","sex":"男","city":"城市-4","sign":"簽名-4","experience":807,"logins":51,"wealth":76263262,"classify":"作家","score":6},{"id":10005,"username":"user-5","sex":"女","city":"城市-5","sign":"簽名-5","experience":173,"logins":68,"wealth":60344147,"classify":"作家","score":87},{"id":10006,"username":"user-6","sex":"女","city":"城市-6","sign":"簽名-6","experience":982,"logins":37,"wealth":57768166,"classify":"作家","score":34},{"id":10007,"username":"user-7","sex":"男","city":"城市-7","sign":"簽名-7","experience":727,"logins":150,"wealth":82030578,"classify":"作家","score":28},{"id":10008,"username":"user-8","sex":"男","city":"城市-8","sign":"簽名-8","experience":951,"logins":133,"wealth":16503371,"classify":"詞人","score":14},{"id":10009,"username":"user-9","sex":"女","city":"城市-9","sign":"簽名-9","experience":484,"logins":25,"wealth":86801934,"classify":"詞人","score":75},{"id":10010,"username":"user-10","sex":"女","city":"城市-10","sign":"簽名-10","experience":1016,"logins":182,"wealth":71294671,"classify":"詩(shī)人","score":34},{"id":10011,"username":"user-11","sex":"女","city":"城市-11","sign":"簽名-11","experience":492,"logins":107,"wealth":8062783,"classify":"詩(shī)人","score":6},{"id":10012,"username":"user-12","sex":"女","city":"城市-12","sign":"簽名-12","experience":106,"logins":176,"wealth":42622704,"classify":"詞人","score":54},{"id":10013,"username":"user-13","sex":"男","city":"城市-13","sign":"簽名-13","experience":1047,"logins":94,"wealth":59508583,"classify":"詩(shī)人","score":63},{"id":10014,"username":"user-14","sex":"男","city":"城市-14","sign":"簽名-14","experience":873,"logins":116,"wealth":72549912,"classify":"詞人","score":8},{"id":10015,"username":"user-15","sex":"女","city":"城市-15","sign":"簽名-15","experience":1068,"logins":27,"wealth":52737025,"classify":"作家","score":28},{"id":10016,"username":"user-16","sex":"女","city":"城市-16","sign":"簽名-16","experience":862,"logins":168,"wealth":37069775,"classify":"醬油","score":86},{"id":10017,"username":"user-17","sex":"女","city":"城市-17","sign":"簽名-17","experience":1060,"logins":187,"wealth":66099525,"classify":"作家","score":69},{"id":10018,"username":"user-18","sex":"女","city":"城市-18","sign":"簽名-18","experience":866,"logins":88,"wealth":81722326,"classify":"詞人","score":74},{"id":10019,"username":"user-19","sex":"女","city":"城市-19","sign":"簽名-19","experience":682,"logins":106,"wealth":68647362,"classify":"詞人","score":51},{"id":10020,"username":"user-20","sex":"男","city":"城市-20","sign":"簽名-20","experience":770,"logins":24,"wealth":92420248,"classify":"詩(shī)人","score":87},{"id":10021,"username":"user-21","sex":"男","city":"城市-21","sign":"簽名-21","experience":184,"logins":131,"wealth":71566045,"classify":"詞人","score":99},{"id":10022,"username":"user-22","sex":"男","city":"城市-22","sign":"簽名-22","experience":739,"logins":152,"wealth":60907929,"classify":"作家","score":18},{"id":10023,"username":"user-23","sex":"女","city":"城市-23","sign":"簽名-23","experience":127,"logins":82,"wealth":14765943,"classify":"作家","score":30},{"id":10024,"username":"user-24","sex":"女","city":"城市-24","sign":"簽名-24","experience":212,"logins":133,"wealth":59011052,"classify":"詞人","score":76},{"id":10025,"username":"user-25","sex":"女","city":"城市-25","sign":"簽名-25","experience":938,"logins":182,"wealth":91183097,"classify":"作家","score":69},{"id":10026,"username":"user-26","sex":"男","city":"城市-26","sign":"簽名-26","experience":978,"logins":7,"wealth":48008413,"classify":"作家","score":65},{"id":10027,"username":"user-27","sex":"女","city":"城市-27","sign":"簽名-27","experience":371,"logins":44,"wealth":64419691,"classify":"詩(shī)人","score":60},{"id":10028,"username":"user-28","sex":"女","city":"城市-28","sign":"簽名-28","experience":977,"logins":21,"wealth":75935022,"classify":"作家","score":37},{"id":10029,"username":"user-29","sex":"男","city":"城市-29","sign":"簽名-29","experience":647,"logins":107,"wealth":97450636,"classify":"醬油","score":27} # 每頁(yè)顯示5條數(shù)據(jù) paginator = Paginator(resp, 5) page = request.GET.get('page') contacts = paginator.get_page(page) return render(request, 'index.html', {'contacts': contacts})
第二步:前端顯示模塊(基于layui模塊),在templates目錄下新建一個(gè)index.html文件(按照自己需求在官網(wǎng)復(fù)制代碼)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>翻頁(yè)</title> <meta name="renderer" content="webkit"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <link rel="stylesheet" href="../static/layui/css/layui.css" rel="external nofollow" media="all"> </head> <body> <div > <fieldset class="layui-elem-field layui-field-title" > <legend>翻頁(yè)(layui風(fēng)格+django功能)</legend> </fieldset> <table class="layui-table"> <colgroup> <col width="150"> <col width="200"> <col> </colgroup> <thead> <tr class="layui-bg-red"> <th>標(biāo)題</th> <th>用戶名</th> <th>手機(jī)號(hào)碼</th> <th>郵箱地址</th> </tr> </thead> <tbody> {% for contact in contacts %} <tr> <td>{{ contact.id }}</td> <td>{{ contact.username }}</td> <td>{{ contact.sex }}</td> <td>{{ contact.experience }}</td> </tr> {% endfor %} </tbody> </table> <script src="../static/layui/layui.js" charset="utf-8"></script> </body> </html>
第三步:在index.html里添加如下Django分頁(yè)功能即可:
<div class="pagination"> <span class="step-links"> {% if contacts.has_previous %} <button class="layui-btn"> <a href="?page=1" rel="external nofollow" >第一頁(yè)</a> </button> <button class="layui-btn"> <a href="?page={{ contacts.previous_page_number }}" rel="external nofollow" ><i class="layui-icon"></i></a> </button> {% endif %} <span class="current"> <button class="layui-btn"> 第 {{ contacts.number }}頁(yè) 共 {{ contacts.paginator.num_pages }}頁(yè) </button> </span> {% if contacts.has_next %} <button class="layui-btn"> <a href="?page={{ contacts.next_page_number }}" rel="external nofollow" ><i class="layui-icon"></i></a> </button> <button class="layui-btn"> <a href="?page={{ contacts.paginator.num_pages }}" rel="external nofollow" >最后一頁(yè)</a> </button> {% endif %} </span> </div> </div>
實(shí)現(xiàn)效果圖如下:
關(guān)于“Python Django如何實(shí)現(xiàn)layui風(fēng)格+django分頁(yè)功能”這篇文章就分享到這里了,希望以上內(nèi)容可以對(duì)大家有一定的幫助,使各位可以學(xué)到更多知識(shí),如果覺(jué)得文章不錯(cuò),請(qǐng)把它分享出去讓更多的人看到。
分享標(biāo)題:PythonDjango如何實(shí)現(xiàn)layui風(fēng)格+django分頁(yè)功能-創(chuàng)新互聯(lián)
網(wǎng)頁(yè)地址:http://m.rwnh.cn/article32/hcipc.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供標(biāo)簽優(yōu)化、網(wǎng)站設(shè)計(jì)、定制開(kāi)發(fā)、微信公眾號(hào)、定制網(wǎng)站、營(yíng)銷型網(wǎng)站建設(shè)
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容