假設現有需求如下：
需要一個頁面分頁展示信息，在該頁面添加搜索框以提供檢索功能。
那麼，我們知道，展示信息和檢索功能是在同一個頁面，也就是共用一個路由。
代碼如下：
第一步，寫路由：爲了清晰，這裏只給出主頁和展示頁面的路由。
urls.py：
from django.urls import path
from . import views
from django.conf.urls.static import static
from django.conf import settings
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
# from django.contrib import staticfiles
urlpatterns = [
# 主頁
path('', views.index),
# 訪問他人信息入口，分頁展示
path('other/profile', views.request_user),
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
urlpatterns += staticfiles_urlpatterns()
第二步，寫視圖：這裏做了訪問限制，登錄才能訪問
views.py：
from django.contrib.auth.decorators import login_required
from django.shortcuts import render, redirect
from django.http import HttpResponseRedirect, HttpResponse
from django.contrib.auth import authenticate, login, logout
from .models import UserInfo, Email_Message, Wastes
from django.contrib.auth.models import AnonymousUser
from django.core.paginator import Paginator, EmptyPage, PageNotAnInteger
@login_required(login_url='/tologin')
def request_user(request):
# 實現搜索
key = request.GET.get('key')
all_users = UserInfo.objects.filter(cate="買家").all()
userlist = []
# 如果前端傳入關鍵字，纔會進行檢索，否則顯示全部買家
if key:
for user in all_users:
if key in user.address:
userlist.append(user)
all_users = userlist
if all_users:
paginator = Paginator(all_users, 2)
page = request.GET.get('page')
try:
contacts = paginator.page(page)
except PageNotAnInteger:
contacts = paginator.page(1)
except EmptyPage:
contacts = paginator.page(paginator.num_pages)
return render(request, 'Myapp/userlist.html', {'contacts': contacts})
else:
info = '暫無數據'
return render(request, 'Myapp/userlist.html', {'info': info})
分頁的原理是用到了django自帶的分頁組件
需要注意的是，搜索的關鍵字傳參，用的是GET請求，而不是POST請求
簡單來說，就是先判斷前端頁面是否用搜索框搜索了關鍵字，如果搜索了，那麼這個詞會被
key = request.GET.get('key')
賦值給key，然後進行後續判斷處理即可。
如果沒有，就正常展示我們需要展示的。
分頁的原理。
可以去看這個組件的文檔介紹。
如果返回的key檢索不到結果，返回空數據頁，並提醒。
html代碼：
{% load static %}
<!--[if lt IE 7 ]><html class="ie ie6" lang="en"> <![endif]-->
<!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]-->
<!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!-->
<html lang="en"> <!--<![endif]-->
<head>
<!-- favicon.ico
================================================== -->
<link rel='shortcut icon' href="{% static 'Myapp/img/favicon.con' %}" type="image/x-icon"/>
<!-- Basic Page Needs
================================================== -->
<meta charset="utf-8">
<title>Detail</title>
<meta name="description" content="">
<meta name="author" content="">
<!-- Mobile Specific Metas
================================================== -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<!-- CSS
================================================== -->
<link rel="stylesheet" href="{% static 'Myapp/css/zerogrid.css' %}">
<link rel="stylesheet" href="{% static 'Myapp/css/style.css' %}">
<link rel="stylesheet" href="{% static 'Myapp/css/lightbox.css' %}">
<!-- Custom Fonts -->
<link href="{% static 'Myapp/assets/css/font-awesome.min.css' %}" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="{% static 'Myapp/css/menu.css' %}">
<link rel="stylesheet" href="{% static 'Myapp/assets/css/bootstrap.min.css' %}">
<script src="{% static 'Myapp/js/jquery1111.min.js' %}" type="text/javascript"></script>
<script src="{% static 'Myapp/js/script.js' %}"></script>
<!--[if lt IE 8]>
<div style=' clear: both; text-align:center; position: relative;'>
<a href="http://windows.microsoft.com/en-US/internet-explorer/Items/ie/home?ocid=ie6_countdown_bannercode">
<img src="http://storage.ie6countdown.com/assets/100/images/banners/warning_bar_0000_us.jpg" border="0" height="42" width="820" alt="You are using an outdated browser. For a faster, safer browsing experience, upgrade for free today." />
</a>
</div>
<![endif]-->
<!--[if lt IE 9]>
<script src="js/html5.js"></script>
<script src="js/css3-mediaqueries.js"></script>
<![endif]-->
</head>
<body>
<div class="wrap-body">
<!--////////////////////////////////////Header-->
<header class="zerogrid">
<div class="logo"><img src="{% static 'Myapp/img/logo.png' %}" alt=""/></div>
<div id='cssmenu' class="align-center">
<ul>
<li><a href='http://127.0.0.1:8000/'><span>主頁</span></a></li>
<li><a href='http://127.0.0.1:8000/about'><span>關於我們</span></a></li>
<li><a href='http://127.0.0.1:8000/show_detail'><span>每日看價</span></a></li>
<li><a href='http://127.0.0.1:8000/other/profile'><span>找個買家</span></a></li>
<li class='last'><a href='http://127.0.0.1:8000/contact'><span>聯繫我們</span></a></li>
</ul>
</div>
<form style="float: right">
{% csrf_token %}
<label>
<div class="form-group">
<input type="search" class="form-control" name="key" placeholder="您可輸入所在城市以檢索買家">
</div>
</label>
<input class="btn btn-default" type="submit" value="搜索">
</form>
</header>
<!--////////////////////////////////////Container-->
<div style="text-align: center">
<table style="float: contour; margin:0 auto;text-align: center; width: 800px;" class="table table-bordered">
<tr style="text-align: center" class="success">
<td>暱稱</td>
<td>地址</td>
<td>最近活躍</td>
</tr>
{% for u in contacts %}
<tr class="info">
<td><a
href="http://127.0.0.1:8000/other/profile/{{ u.username }}">{{ u.username }}</a>
</td>
<td>{{ u.address }}</td>
<td>{{ u.last_login }}</td>
</tr>
{% endfor %}
</table>
</div>
<div class="navigation">
<ul>
{% for pg in contacts.paginator.page_range %}
{% if contacts.number == pg %}
<li class="active"><a href="?page={{ pg }}">{{ pg }}</a></li>
{% else %}
<li><a href="?page={{ pg }}">{{ pg }}</a></li>
{% endif %}
{% endfor %}
{% if contacts.has_next %}
<li><a href="?page={{ contacts.next_page_number }}">下一頁</a></li>
{% endif %}
</ul>
</div>
<!--////////////////////////////////////Footer-->
</div>
{% if info %}
<script>
window.alert('{{ info }}');
</script>
{% endif %}
</body>
</html>
效果：
主頁主要功能部分：
信息頁分頁與搜索：搜索框和分頁都是存在的，目前是第一頁：http://127.0.0.1:8000/other/profile
第二頁：http://127.0.0.1:8000/other/profile?page=2
搜索測試：
搜索無效信息測試：
算是比較完整了。
