用Django搭建可分页的商品信息网页

装好Django，写好index.html后，可以展示网页了。但是这只是静态页面，没有关联数据库，也不能分页展示商品信息。本节连接mongodb数据库（事先已准备好数据），从中取出几十条商品信息，每页展示4个商品信息，并具有翻页功能，做好的页面效果大致如下：

 开始代码：

1、在settings.py（项目名称目录下）中，增加2段代码，分别是static文件夹位置和连接mongodb的代码：

STATIC_URL = '/static/'
STATICFILES_DIRS = (os.path.join(BASE_DIR,'static'),)   # 指定static文件夹位置

from mongoengine import connect
connect('ganji', host='127.0.0.1', port=27017)   # 连接ganji数据库

2、在models.py（本APP目录下）中，代码：

from django.db import models
from mongoengine import *

# Create your models here.

# 创建帖子信息类，继承自mongoengine的文件类
class PostInfo(Document):    
    area = ListField(StringField())
    title = StringField()
    cates = ListField(StringField())
    price = StringField()

    pub_date = StringField()      # 数据集里面所有的字段都要有，就算不用也得列出来
    url = StringField()
    look = StringField()
    time = IntField()
    cates2 = StringField()

    meta = {'collection':'goods_info'}   # 定位好是goods_info数据集

3、在views.py（本APP目录下）中，代码：

from django.shortcuts import render
from sample_blog.models import PostInfo    # 导入已写好的数据结构
from django.core.paginator import Paginator  # 导入分页器

# Create your views here.
def index(request):
    limit = 4  # 每页放几条帖子
    all_post_info = PostInfo.objects[:20]  # 取前20个帖子的数据
    paginatior = Paginator(all_post_info, limit)   # 用分页器分页
    page_num = request.GET.get('page', 1)  # 取request中的页码，取不到就为1
    loaded = paginatior.page(page_num)  # 取page_num那一页的数据，一般是4条

    context = {
        # 首条固定的帖子信息
        'title': '三星 A5 白色',
        'des': '【图】三星 A5 白色 没有打开过 - 朝阳望京台式机/配件 - 北京58同城',
        'price': '1500',
        'area': ["朝阳", "望京"],
        'tag1': "北京二手市场",
        'tag2': "北京二手台式机/配件",

        # 每页更新的帖子信息
        'one_page_post': loaded
    }
    return render(request, 'index.html',context)

4、修改index.html文件，主要修改了有文字标注的部分：

  <div class="posts">
                <h1 class="content-subhead">Pinned Post</h1>

                <!-- A single blog post -->
                <section class="post">
                    <header class="post-header">
                        <img class="post-avatar" alt="Tilo Mitra's avatar" height="48" width="48" src="{% static 'img/common/tilo-avatar.png' %}">
　　　　　　　　　　　　　　<!-- 修改了{{title}}等 -->
                        <h2 class="post-title">{{ title }}</h2>

                        <p class="post-meta">
                            地区 <a href="#" class="post-author">{{ area }}</a> under <a class="post-category post-category-design" href="#">{{ tag1 }}</a> <a class="post-category post-category-pure" href="#">{{tag2}}</a>
                        </p>
                    </header>

                    <div class="post-description">
                        <p>
                            {{ des }}|价格：{{ price }}
                        </p>
                    </div>
                </section>
            </div>

            <div class="posts">
                <h1 class="content-subhead">Recent Posts</h1>
<!-- 增加for循环，将one_page_post值带入 -->
                {% for item in one_page_post %}
                    <section class="post">
                        <header class="post-header">
                            <img class="post-avatar" alt="Eric Ferraiuolo's avatar" height="48" width="48" src="{% static 'img/common/ericf-avatar.png' %}">

                            <h2 class="post-title">{{ item.title }}</h2>

                            <p class="post-meta">
                                地区 <a class="post-author" href="#">{{ item.area }}</a>分类
<!-- 再增加一个for循环，把cates里的元素都展示出来 -->
                                {% for cate in item.cates %}
                                     <a class="post-category post-category-pure" href="#">{{ cate }}</a>
                                {% endfor %}
                            </p>
                        </header>

                        <div class="post-description">
                            <p>
                                {{ item.title }}|价格：{{ item.price }}
                            </p>
                        </div>
                    </section>
                {% endfor %}

            </div>
　　　　　　　　<!-- 增加本段div，实现页面底部可翻页 -->
             <div align="center">
                {% if one_page_post.has_previous %}
                    <a href="?page={{ one_page_post.previous_page_number }}">< Pre</a>
                {% endif %}
                    <span> {{ one_page_post.number }} of {{ one_page_post.paginator.num_pages }} </span>
                {% if one_page_post.has_next %}
                    <a href="?page={{ one_page_post.next_page_number }}">Next ></a>
                {% endif %}
             </div>

5、附上urls.py（项目名称目录下）文件，本节中并没有修改，但也备注上：

from django.contrib import admin
from django.urls import path
from sample_blog.views import index

urlpatterns = [
    path('admin/', admin.site.urls),
    path('index/', index),
]

　　以上步骤完成后，启动服务（python manage.py runserver），访问http://127.0.0.1:8000/index/即可看到效果。