使用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 正则式使用心得
May 07 Python
Python验证企业工商注册码
Oct 25 Python
Python 字符串大小写转换的简单实例
Jan 21 Python
python与sqlite3实现解密chrome cookie实例代码
Jan 20 Python
Python实现Kmeans聚类算法
Jun 10 Python
Python简单实现查找一个字符串中最长不重复子串的方法
Mar 26 Python
每天迁移MySQL历史数据到历史库Python脚本
Apr 13 Python
浅谈python的dataframe与series的创建方法
Nov 12 Python
python3使用print打印带颜色的字符串代码实例
Aug 22 Python
windows10环境下用anaconda和VScode配置的图文教程
Mar 30 Python
浅谈在JupyterNotebook下导入自己的模块的问题
Apr 16 Python
如何在vscode中安装python库的方法步骤
Jan 06 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 HTML代码串截取代码
2008/12/29 PHP
PHP简单获取多个checkbox值的方法
2016/06/13 PHP
js资料toString 方法
2007/03/13 Javascript
jquery 笔记 事件
2011/11/02 Javascript
轻松掌握JavaScript策略模式
2016/08/25 Javascript
Vue.js仿Metronic高级表格(一)静态设计
2017/04/17 Javascript
JavaScript表单即时验证 验证不成功不能提交
2017/08/31 Javascript
js Date()日期函数浏览器兼容问题解决方法
2017/09/12 Javascript
JS中跳出循环的示例代码
2017/09/14 Javascript
web前端开发中常见的多列布局解决方案整理(一定要看)
2017/10/15 Javascript
javascript原生封装一个淡入淡出效果的函数测试实例代码
2018/03/19 Javascript
详解JavaScript 新语法之Class 的私有属性与私有方法
2019/04/23 Javascript
layui 图片上传+表单提交+ Spring MVC的实例
2019/09/21 Javascript
Vue.extend 编程式插入组件的实现
2019/11/18 Javascript
video.js添加自定义组件的方法
2020/12/09 Javascript
python简单判断序列是否为空的方法
2015/06/30 Python
python中函数传参详解
2016/07/03 Python
使用django-crontab实现定时任务的示例
2018/02/26 Python
Python实现OpenCV的安装与使用示例
2018/03/30 Python
用pandas中的DataFrame时选取行或列的方法
2018/07/11 Python
纯用NumPy实现神经网络的示例代码
2018/10/24 Python
Python不同目录间进行模块调用的实现方法
2019/01/29 Python
关于windows下Tensorflow和pytorch安装教程
2020/02/04 Python
Python如何使用turtle库绘制图形
2020/02/26 Python
Python3爬虫mitmproxy的安装步骤
2020/07/29 Python
Python爬虫获取豆瓣电影并写入excel
2020/07/31 Python
虚拟环境及venv和virtualenv的区别说明
2021/02/05 Python
平面设计自荐信
2013/10/07 职场文书
2014年预备党员学习两会心得体会
2014/03/17 职场文书
甜品店创业计划书
2014/09/21 职场文书
创卫工作总结2015
2015/04/22 职场文书
尊师重教主题班会
2015/08/14 职场文书
面试被问select......for update会锁表还是锁行
2021/11/11 MySQL
Go语言读取txt文档的操作方法
2022/01/22 Golang
在vue中import()语法不能传入变量的问题及解决
2022/04/01 Vue.js
MySQL 原理与优化之原数据锁的应用
2022/08/14 MySQL