溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

使用Django搭建網(wǎng)站實(shí)現(xiàn)商品分頁功能的方法

發(fā)布時(shí)間：2020-07-22 15:42:27 來源：億速云 閱讀：191 作者：小豬 欄目：開發(fā)技術(shù)

這篇文章主要講解了使用Django搭建網(wǎng)站實(shí)現(xiàn)商品分頁功能的方法，內(nèi)容清晰明了，對(duì)此有興趣的小伙伴可以學(xué)習(xí)一下，相信大家閱讀完之后會(huì)有幫助。

裝好Django，寫好index.html后，可以展示網(wǎng)頁了。但是這只是靜態(tài)頁面，沒有關(guān)聯(lián)數(shù)據(jù)庫，也不能分頁展示商品信息。本節(jié)連接mongodb數(shù)據(jù)庫（事先已準(zhǔn)備好數(shù)據(jù)），從中取出幾十條商品信息，每頁展示4個(gè)商品信息，并具有翻頁功能，做好的頁面效果大致如下：

使用Django搭建網(wǎng)站實(shí)現(xiàn)商品分頁功能的方法

開始代碼：

1、在settings.py（項(xiàng)目名稱目錄下）中，增加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數(shù)據(jù)庫

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

from django.db import models
from mongoengine import *
 
# Create your models here.
 
# 創(chuàng)建帖子信息類，繼承自mongoengine的文件類<br data-filtered="filtered">class PostInfo(Document):  
  area = ListField(StringField())
  title = StringField()
  cates = ListField(StringField())
  price = StringField()
 
  pub_date = StringField()   # 數(shù)據(jù)集里面所有的字段都要有，就算不用也得列出來
  url = StringField()
  look = StringField()
  time = IntField()
  cates2 = StringField()
 
  meta = {'collection':'goods_info'}  # 定位好是goods_info數(shù)據(jù)集

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

from django.shortcuts import render
from sample_blog.models import PostInfo  # 導(dǎo)入已寫好的數(shù)據(jù)結(jié)構(gòu)
from django.core.paginator import Paginator # 導(dǎo)入分頁器
 
# Create your views here.
def index(request):
  limit = 4 # 每頁放幾條帖子
  all_post_info = PostInfo.objects[:20] # 取前20個(gè)帖子的數(shù)據(jù)
  paginatior = Paginator(all_post_info, limit)  # 用分頁器分頁
  page_num = request.GET.get('page', 1) # 取request中的頁碼，取不到就為1
  loaded = paginatior.page(page_num) # 取page_num那一頁的數(shù)據(jù)，一般是4條
 
  context = {
    # 首條固定的帖子信息
    'title': '三星 A5 白色',
    'des': '【圖】三星 A5 白色 沒有打開過 - 朝陽望京臺(tái)式機(jī)/配件 - 北京58同城',
    'price': '1500',
    'area': ["朝陽", "望京"],
    'tag1': "北京二手市場",
    'tag2': "北京二手臺(tái)式機(jī)/配件",
 
    # 每頁更新的帖子信息
    'one_page_post': loaded
  }
  return render(request, 'index.html',context)

4、修改index.html文件，主要修改了有文字標(biāo)注的部分：

<div class="posts">
       <h2 class="content-subhead">Pinned Post</h2>
 
       <!-- 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' %}">
　　　　　　　　　　　　<!-- 修改了{(lán){title}}等 -->
           <h3 class="post-title">{{ title }}</h3>
 
           <p class="post-meta">
             地區(qū) <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 }}|價(jià)格：{{ price }}
           </p>
         </div>
       </section>
     </div>
 
     <div class="posts">
       <h2 class="content-subhead">Recent Posts</h2><!-- 增加for循環(huán)，將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' %}">
 
             <h3 class="post-title">{{ item.title }}</h3>
 
             <p class="post-meta">
               地區(qū) <a class="post-author" href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >{{ item.area }}</a>分類<!-- 再增加一個(gè)for循環(huán)，把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 }}|價(jià)格：{{ item.price }}
             </p>
           </div>
         </section>
       {% endfor %}
 
     </div>
　　　　　　<!-- 增加本段div，實(shí)現(xiàn)頁面底部可翻頁 -->
      <div align="center">
       {% if one_page_post.has_previous %}
         <a href="&#63;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="&#63;page={{ one_page_post.next_page_number }}" rel="external nofollow" >Next ></a>
       {% endif %}
      </div>

5、附上urls.py（項(xiàng)目名稱目錄下）文件，本節(jié)中并沒有修改，但也備注上：

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),
]

以上步驟完成后，啟動(dòng)服務(wù)（python manage.py runserver），訪問http://127.0.0.1:8000/index/即可看到效果。

看完上述內(nèi)容，是不是對(duì)使用Django搭建網(wǎng)站實(shí)現(xiàn)商品分頁功能的方法有進(jìn)一步的了解，如果還想學(xué)習(xí)更多內(nèi)容，歡迎關(guān)注億速云行業(yè)資訊頻道。

向AI問一下細(xì)節(jié)

免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點(diǎn)不代表本網(wǎng)站立場，如果涉及侵權(quán)請(qǐng)聯(lián)系站長郵箱：is@yisu.com進(jìn)行舉報(bào)，并提供相關(guān)證據(jù)，一經(jīng)查實(shí)，將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI
助
手