a1.png
在前面的基礎上，連接mongoDB數據庫，將數據庫的信息顯示在頁面上，并可以翻頁查看。
1.app項目下的models.py文件的設計
from django.db import models
from mongoengine import *
# Create your models here.
class ItemInfo(Document):
title = StringField()
url = StringField()
pub_data = StringField()
area = ListField(StringField())
cate = ListField(StringField())
look = StringField()
time = StringField()
price = IntField()
meta = {'collection': 'info_sheet'}
2.views.py文件
from django.shortcuts import render
from app_one.models import ItemInfo #引入models文件的內容
from django.core.paginator import Paginator #分頁
def home(request):
limit = 10
item_info = ItemInfo.objects
paginator = Paginator(item_info, limit)
page = request.GET.get('page', 1)
loaded = paginator.page(page)
content = {'ItemInfo': loaded}
return render(request, 'pure_index_paginator.html', content)
3.settings.py文件
STATIC_URL = '/static/'
STATICFILES_DIRS = (os.path.join(BASE_DIR, 'static'),)
from mongoengine import connect #在后面添加這兩行連接數據庫
connect('gan', host='127.0.0.1', port=27017) #‘gan’是裝表單的數據庫
4.html文件
{% load static %}
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="A layout example that shows off a blog page with a list of posts.">
<title>Blog – Layout Examples – Pure</title>
<link rel="stylesheet" >
<link rel="stylesheet" >
{# 上面兩個 css 是調整自適應的部分，直接從官網的 CDN 引用就行；下面的才是網站所需的樣式；最后刪除了適應 ie 瀏覽器的部分，不需要適應，直接放棄 ;) #}
<link rel="stylesheet" href="{% static 'css/blog.css' %}">
</head>
<body>
<div id="layout" class="pure-g">
<div class="sidebar pure-u-1 pure-u-md-1-4">
<div class="header">
<h1 class="brand-title">A Sample Blog</h1>
<h2 class="brand-tagline">Creating a blog layout using Pure</h2>
<nav class="nav">
<ul class="nav-list">
<li class="nav-item">
<a class="pure-button" >Pure</a>
</li>
<li class="nav-item">
<a class="pure-button" >YUI Library</a>
</li>
</ul>
</nav>
</div>
</div>
<div class="content pure-u-1 pure-u-md-3-4">
<div>
<div class="posts">
<h1 class="content-subhead">數據信息</h1>
{% for item in ItemInfo %}
<section class="post">
<header class="post-header">
<h3 class="post-title">￥{{ item.price }} - {{ item.pub_date }}</h3>
<p class="post-meta">
{% for cate in item.cates %}
<a class="post-category post-category-pure" href="#">{{ cate }}</a>
{% endfor %}
{% for a in item.area %}
<a class="post-category post-category-design" href="#">{{ a }}</a>
{% endfor %}
</p>
</header>
<div class="post-description">
<p>
{{ item.title }}
</p>
</div>
</section>
{% endfor %}
</div>
<div class="footer">
<div class="pure-menu pure-menu-horizontal">
<ul>
{% if ItemInfo.has_previous %}
<li class="pure-menu-item"><a class="icon item" href="?page={{ ItemInfo.previous_page_number }}"> Pre </a></li>
{% endif %}
<li class="pure-menu-item">{{ ItemInfo.number }} of {{ ItemInfo.paginator.num_pages }} </li>
{% if ItemInfo.has_next %}
<li class="pure-menu-item"> <a class="icon item" href="?page={{ ItemInfo.next_page_number }}"> Next </a></li>
{% endif %}
</ul>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
