在次申明,之所以重做这个资料是因为原幕课教程漏洞太多,新手根本没有办法正常照些学习,我凭着老男孩python 课程基础,重做这个教程 ,更改版本为当前最新版本,为了方法以后的人学习,并不是照着原文照 抄,
,每一步案例都是亲自测行,能正常运行后在搬在这儿的,
先从分页说起:
进入虚拟目录 workon XXXX
安装分页组件:
pip install django-pure-pagination
配置环境
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'users',
'courses',
'organization',
'operation',
'xadmin',
'crispy_forms',
'reversion',
'captcha',
'pure_pagination',// 这一项是分页
在此之前,先看一下官文示例:
# views.py from django.shortcuts import render_to_response from pure_pagination import Paginator, EmptyPage, PageNotAnInteger def index(request): # 尝试获取页数参数 try: page = request.GET.get('page', 1) except PageNotAnInteger: page = 1 # objects是取到的数据 objects = ['john', 'edward', 'josh', 'frank'] # 对取到的数据进行分页 p = Paginator(objects, request=request) # 此时前台显示的就是我们此前获取的第几页的数据 people = p.page(page) return render_to_response('index.html', { 'people': people, }
总结,核心配置共总三步,第一步,得到数据,第二步 加入函数,第三步,转换成变量交给前端:
以本文为例子,完整代码:
# views.py from django.shortcuts import render_to_response from pure_pagination import Paginator, EmptyPage, PageNotAnInteger class OrgView(View): def get(self, request): # 查找所有的城市信息 all_citys = CityDict.objects.all() # 查找所有的课程机构信息 all_orgs = CourseOrg.objects.all() # 统计课程机构的数量 org_nums = all_orgs.count() # 对课程机构进行分页,尝试获取前端get请求传递过来的page参数 # 如果是不合法的配置参数则默认返回第一页 try: page = request.GET.get('page', 1) except PageNotAnInteger: page = 1 # 这里指从all_org中取五个出来,每页显示6个,这个字段必填 p = Paginator(all_orgs, 6, request=request) orgs = p.page(page) return render(request, "org-list.html", { "all_citys": all_citys, "all_orgs": orgs, "org_nums": org_nums, })
然后前端就可以使用它自动放生的很多变量,需要注意这不是qert类型 不能用传统遍历,现在可以使用它生成的变量来操作分页上一页,当前页,,,
<div class="pagination"> {% if page_obj.has_previous %} <a href="?{{ page_obj.previous_page_number.querystring }}" class="prev">‹‹ {% trans "previous" %}</a> {% else %} <span class="disabled prev">‹‹ {% trans "previous" %}</span> {% endif %} {% for page in page_obj.pages %} {% if page %} {% ifequal page page_obj.number %} <span class="current page">{{ page }}</span> {% else %} <a href="?{{ page.querystring }}" class="page">{{ page }}</a> {% endifequal %} {% else %} ... {% endif %} {% endfor %} {% if page_obj.has_next %} <a href="?{{ page_obj.next_page_number.querystring }}" class="next">{% trans "next" %} ››</a> {% else %} <span class="disabled next">{% trans "next" %} ››</span> {% endif %} </div>
技术点二 静态路由关联模板
数据库的图片地址路由:
比如数据库存的是 org/07-06 这是一个相对地址,我们如何设置一个新的地址来配置默认为入一个XXXX的文件 使访问时 www://1270.0.0:8000/xxx/org/07/06就能访问到,首先要配一个新的url地址来区配
from django.views.static import serve
from senian.settings import MEDIA_ROOT
re_path('media/(?P<path>.*)',serve, {"document_root": MEDIA_ROOT}),
然后在配置文件配好路由静态:文件最后加上:
MEDIA_URL='/media/'
MEDIA_ROOT = os.path.join(BASE_DIR,'media')
还在是模板加入渲染配置:
TEMPLATES = [
{
'BACKEND': 'django.template.backends.django.DjangoTemplates',
'DIRS': [os.path.join(BASE_DIR, 'templates')]
,
'APP_DIRS': True,
'OPTIONS': {
'context_processors': [
'django.template.context_processors.debug',
'django.template.context_processors.request',
'django.contrib.auth.context_processors.auth',
'django.contrib.messages.context_processors.messages',
'django.template.context_processors.media',
'django.template.context_processors.media',
],
},
},
]
如此也来,前端便可以使用示例:
{% for course_org in all_orgs.object_list %}
<dl class="des difdes">
<dt>
<a href="org-detail-homepage.html">
<img width="200" height="120" class="scrollLoading" data-url="{{ MEDIA_URL }}{{ course_org.image }}"/>
</a>
</dt>
<dd>
注解:为什么data-url 这个属性,基实这是一个js 需要属性,这儿图片ajax 生成的,。。。。
技术点三 内容筛选和关联查询
前端中使用
?city={{ city.id }} 向服务器传入参数
<div class="cont">
<a href="?ct="><span class="active2">全部</span></a>
{% for city in all_citys %}
<a href="?city={{ city.id }}"><span class="">{{ city.name }}</span></a>
{% endfor %}
服务器接收后:
先得到id ,查询 返回时带上 id
all_orgs = CourseOrg.objects.all()
if city_id:
all_orgs = all_orgs.filter(city_id=int(city_id))
筛好了,但是选中正在筛选好的样子没有出来,我们需要把当前ID 和 参数那个对比一下,如果是当前页,将样式设为选 中状态,所以得先向前端传入选 中Id
中间略过很多代码、、、
return render(request, "org-list.html", {
"all_citys": all_citys,
"all_orgs": orgs,
"xall_orgs":all_orgs,
"org_nums": org_nums,
'city_id':city_id,
})
前端代码如下:请细看:
<h2>所在地区</h2>
<div class="more">更多</div>
<div class="cont">
<a href="?ct="><span class="{% ifequal city_id '' %}active2"{% endifequal %}>全部</span></a>
{% for city in all_citys %}
<a href="?city={{ city.id }}"><span class="{% ifequal city_id city.id|stringformat:"i" %}active2{% endifequal %}">{{ city.name }}</span></a>
{% endfor %}
技术点四 路由分发:
url 太多的时候需要分在另一个app 处理,可以在主url 配置 分发“
path("org/", include('organization.urls',namespace="org")),
然后在次app下配置:红色部份为重点
from django.urls import path, include,re_path
from .views import OrgView
urlpatterns = [
path("list/", OrgView.as_view(),name = "org_list"),
]
app_name = "organization"
前端引用网址为:
<li class="active" ><a href="{% url 'org:org_list' %}">授课机构</a></li>