本文详细记录了一次Django项目的实战过程，包括项目结构的搭建，首页渲染，模板抽象和继承，系统轮播图的设置，新闻及通知的管理，数据库配置，首页和新闻列表展示，以及新闻详情和消息列表分页的实现。通过这一系列步骤，展示了Django在实际应用中的具体操作和技术要点。
项目结构
在pycharm中创建项目,使用python manage.py startapp命令创建模块分别是system/accounts/mall/mine
在项目下新建utils包和static目录
将项目模板文件放到templetes目录下，将项目静态资源文件放到static目录下
渲染首页
django_mall/urls.py
urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'^$', views.index, name='index')
]
新建django_mall/views.py
from django.shortcuts import render_to_response
def index(request):
return render_to_response('index.html')
配置static目录
参考 https://docs.djangoproject.com/en/1.11/howto/static-files/
django_mall/settings.py
STATICFILES_DIRS = [
os.path.join(BASE_DIR, "static"),
]
得到首页渲染结果
在各模块下新建templates目录并将模板分别放置到相应的templates目录下
在mall目录下新建urls.py
from django.conf.urls import url
from mall import views
urlpatterns = [
# 商品列表
url(r'^prod/list/$', views.product_list, name='product_list'),
# 商品详情
url(r'^prod/detail/(？P<pk>\S+)$', views.product_detail, name='product_detail'),
]
mall/views.py
from django.shortcuts import render
# Create your views here.
def product_list(request, template_name='product_list.html'):
""" 商品列表 """
return render(request, template_name)
def product_detail(request, template_name='product_detail.html'):
""" 商品列表 """
return render(request, template_name)
对创建的模块及进行配置
django_mall/settings.py
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'mall.apps.MallConfig', # 商品模块
'accounts.apps.AccountsConfig', # 用户账户模块
'system.apps.SystemConfig', # 系统模块
'mine.apps.MineConfig', # 个人模块
]
配置url
django_mall/urls.py
urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'^$', views.index, name='index'),
# 商品部分
url(r'^mall/', include('mall.urls', namespace='mall'))
]
运行项目，访问http://127.0.0.1:8000/mall/prod/list/
对product_list.html引用的文件路径进行修正
模板的抽象和继承
templates/base.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta
name="viewport"
content="width=device-width, initial-scale=1, user-scalable=no"
/>
<link rel="stylesheet" href="/static/lib/weui.min.css" />
<link rel="stylesheet" href="/static/css/jquery-weui.css" />
<link rel="stylesheet" href="/static/css/style.css" />
{
% block title %}
<meta name="description" content=""/>
<title>积分商城首页</title>
{
# 页面的头部，可添加头部标签，css,js<title> #}
{
% endblock %}
</head>
<body ontouchstart class="container">
{
% block container %}
{
# 页面的内容区域 #}
{
% endblock %}
<script src="/static/lib/jquery-2.1.4.js"></script>
<script src="/static/lib/fastclick.js"></script>
<script>
//手机端事件穿透
$(function() {
FastClick.attach(document.body);
});
</script>
<script src="/static/js/jquery-weui.js"></script>
{
% block footer %}
{
# 页面底部，可以用来放html片段，可以添加新的js #}
{
% endblock %}
</body>
</html>
templates/footer.html
<!--底部导航-->
<div class="foot-black"></div>
<div class="weui-tabbar wy-foot-menu">
<a href="index.html" class="weui-tabbar__item weui-bar__item--on">
<div class="weui-tabbar__icon foot-menu-home"
最低0.47元/天 解锁文章
2万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
