使用Django搭建网站实现商品分页功能


Posted in Python onMay 22, 2020

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

使用Django搭建网站实现商品分页功能

开始代码:

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的文件类<br data-filtered="filtered">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="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" class="post-author">{{ area }}</a> under <a class="post-category post-category-design" href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >{{ tag1 }}</a> <a class="post-category post-category-pure" href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >{{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="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >{{ item.area }}</a>分类<!-- 再增加一个for循环,把cates里的元素都展示出来 -->
               {% for cate in item.cates %}
                  <a class="post-category post-category-pure" href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >{{ 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 }}" rel="external nofollow" >< 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 }}" rel="external nofollow" >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/即可看到效果。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Python 相关文章推荐
Python+matplotlib实现计算两个信号的交叉谱密度实例
Jan 08 Python
python 将列表中的字符串连接成一个长路径的方法
Oct 23 Python
pandas使用apply多列生成一列数据的实例
Nov 28 Python
关于python下cv.waitKey无响应的原因及解决方法
Jan 10 Python
Python爬虫实战之12306抢票开源
Jan 24 Python
详解Python学习之安装pandas
Apr 16 Python
通过字符串导入 Python 模块的方法详解
Oct 27 Python
python 读取数据库并绘图的实例
Dec 03 Python
Pycharm 2020年最新激活码(亲测有效)
Sep 18 Python
Python reversed反转序列并生成可迭代对象
Oct 22 Python
matplotlib相关系统目录获取方式小结
Feb 03 Python
python3美化表格数据输出结果的实现代码
Apr 14 Python
Tensorflow卷积实现原理+手写python代码实现卷积教程
May 22 #Python
Python实现发票自动校核微信机器人的方法
May 22 #Python
基于django micro搭建网站实现加水印功能
May 22 #Python
基于Tensorflow一维卷积用法详解
May 22 #Python
Python参数传递机制传值和传引用原理详解
May 22 #Python
python filecmp.dircmp实现递归比对两个目录的方法
May 22 #Python
关于keras.layers.Conv1D的kernel_size参数使用介绍
May 22 #Python
You might like
PHP中路径问题的解决方案
2006/10/09 PHP
PHP判断搜索引擎蜘蛛并自动记忆到文件的代码
2012/02/04 PHP
PHP实现时间比较和时间差计算的方法示例
2017/07/24 PHP
php使用mysqli和pdo扩展,测试对比连接mysql数据库的效率完整示例
2019/05/09 PHP
20行代码实现的一个CSS覆盖率测试脚本
2013/07/07 Javascript
JavaScript实现维吉尼亚(Vigenere)密码算法实例
2013/11/22 Javascript
jquery实现预览提交的表单代码分享
2014/05/21 Javascript
Js中使用hasOwnProperty方法检索ajax响应对象的例子
2014/12/08 Javascript
基于Vue.js的表格分页组件
2016/05/22 Javascript
jQuery简单实现iframe的高度根据页面内容自适应的方法
2016/08/01 Javascript
详解vue-cli快速构建项目以及引入bootstrap、jq
2017/05/26 Javascript
Element-ui之ElScrollBar组件滚动条的使用方法
2018/09/14 Javascript
vue路由前进后退动画效果的实现代码
2018/12/10 Javascript
详解js实时获取并显示当前时间的方法
2019/05/10 Javascript
微信小程序制作扭蛋机代码实例
2019/09/24 Javascript
如何正确解决VuePress本地访问出现资源报错404的问题
2020/12/03 Vue.js
[03:57]DOTA2英雄梦之声_第03期_幻影刺客
2014/06/21 DOTA
[03:51]吞吞映像 每周精彩击杀top10第二弹
2014/06/25 DOTA
pygame学习笔记(4):声音控制
2015/04/15 Python
python文件操作相关知识点总结整理
2016/02/22 Python
pandas 读取各种格式文件的方法
2018/06/22 Python
python使用zip将list转为json的方法
2018/12/31 Python
django 多对多表的创建和插入代码实现
2019/09/09 Python
python GUI库图形界面开发之PyQt5窗口布局控件QStackedWidget详细使用方法
2020/02/27 Python
基于K.image_data_format() == 'channels_first' 的理解
2020/06/29 Python
利用CSS3参考手册和CSS3代码生成工具加速来学习网页制
2012/07/11 HTML / CSS
日本食品网上商店:JaponShop.com
2017/11/28 全球购物
戴尔美国官方折扣店:Dell Outlet
2018/02/13 全球购物
求职者简历中的自我评价
2013/10/20 职场文书
经理秘书求职自荐信范文
2014/03/23 职场文书
《画风》教学反思
2014/04/16 职场文书
教师读书活动总结
2014/05/07 职场文书
企业仓管员岗位职责
2014/06/15 职场文书
教师三严三实对照检查材料
2014/09/25 职场文书
个人先进事迹总结
2015/02/26 职场文书
爱的教育观后感
2015/06/17 职场文书