django debug=false后静态文件丢失_轻量级办公平台开发实录(5):django模板的使用

参考资料:https://docs.djangoproject.com/en/1.11/

1 Django基础模板语言:

作为Web 框架,Django 提供了便利的方法以动态地生成HTML。最常见的做法是使用模板。模板包含所需HTML 输出的静态部分,以及一些特殊的语法,描述如何将动态内容插入。

模板:

模板是纯文本文件。模板中通常会包含可以被数值替换的变量,和控制模板逻辑的标签
例如下面一个简单模板示例,其中包含了模板继承,变量使用,逻辑循环等

{% extends "base_generic.html" %}

{% block title %}{{ section.title }}{% endblock %}

{% block content %}
<h1>{{ section.title }}</h1>

{% for story in story_list %}
<h2>
  <a href="{{ story.get_absolute_url }}">
    {{ story.headline|upper }}
  </a>
</h2>
<p>{{ story.tease|truncatewords:"100" }}</p>
{% endfor %}
{% endblock %}

变量:变量包含在{{}}内,上面例子中,{{ section.title }}就是一个变量,它最终会被后台传递过来的数值替换,需要注意的是变量的名称可以包含任意字母数字和下划线,点"."在变量中是由特殊含义的。

过滤器:我们可以通过过滤器来改变变量的显示,例如:如果一个变量是false或者为空,我们可以通过过滤器给定一个默认值:

{{ value|default:"nothing" }}

标签:

一些标签需要指定开始和结束标签,例如:{% if %} ....{% endif %}

常用的还有 block和extends,这两个标签主要用于模板继承,需要注意的是:{% extends %} 标签用于模板继承,它必须是模版中的第一个标签。更多标签功能的使用我将会在项目中学习。

2 项目实现

注意: 当前使用的项目源码是从 tag v1.0生成的dev分支(参考3节 克隆项目和目录结构介绍)
接下来介绍项目使用的模板结构

2.1 使用pycharm运行我们的项目

  • 打开pycharm 选择 File→Open 在弹窗中找得到sandboxOA项目,点OK,打开项目
  • 依次选择File→Settings→Project:sandboxOA→Project Interpreter设置项目运行环境,指向前面章节创建的虚拟环境

0ae357a57e882637edd25934d2eaa9ea.png

2.2 项目中的模板介绍

模板目录结构:
项目模板存放在根目录下的 templates目录下,tag v1.0包含的模板页如下

|-- templates/                # 用来存放模板文件(html)
        |-- base-layer.html       # 项目中弹窗页面需要继承基础模板页
        |-- base-left.html        # 左侧导航
        |-- base-static.html      # 静态文件页面,包含全局的css和javascripts
        |-- head-footer.html      # 头部导航和底部版权信息
        |-- index.html            # 初始页面,后面项目会多次基于这个页面进行功能布局
        |-- page404.html          # 404页面

模板继承关系:

base-static.html → head-footer.html → base-left.html → index.html

2.3 模板和静态文件配置

模板:

我们创建了templates用来存放模板页面,要想让Django能够顺利找到模板,还需要再settings.py配置TEMPLATES,加入:'DIRS': [os.path.join(BASE_DIR, 'templates')] 来指定一个查找模板的目录列表。

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',
            ],
        },
    },
]

静态文件:

网站中用到的图片、JavaScript和CSS这些统称为静态文件,Django提供了django.contrib.staticfile来帮助我们管理它们。
我们在项目根目录下创建了一个static目录用来存放静态文件,要想使用它还需要做如下配置:
- 确认settings.py中 INSTALLED_APPS下包含:django.contrib.staticfiles(默认已经添加)
- 在settings.py中添加 STATIC_URL = '/static/'
- 在settings.py中指定静态文件目录 STATICFILES_DIRS = [os.path.join(BASE_DIR, 'static')]

完成以上配置,就可以在模板中引入静态文件了,模板引入静态文件配置:

{% load staticfiles %}
<html>
<head>
  <link rel="stylesheet" href="{% static 'bootstrap/css/bootstrap.min.css' %}">

  ..............................

2.4 让项目跑起来

完成了模板和静态文件的配置,Django是否可以正常使用模板和静态文件呢?我们来测试一下,打开根目录下sandboxOA/urls.py,加入如下配置:

from django.conf.urls import url
from django.contrib import admin
from django.views.generic import TemplateView

urlpatterns = [
    url(r'^admin/', admin.site.urls),
    url(r'^test/', TemplateView.as_view(template_name='index.html')),
]

通过pycharm运行项目后,在浏览器中访问:http://127.0.0.1:8000/test/

9e529f94f851a43bf62b9b8897b5e16e.png


可以看到项目的模板和样式文件都可以成功使用了。

知乎专栏:Django 学习小组
知乎专栏:SandBox
更多实战文档可关注知识星球:https://t.zsxq.com/a6IqBMr(微信中打开链接)
轻量级办公管理系统项目开源地址:RobbieHan/gistandard
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值