Anaconda+django写出第一个web app(四)
前面对Models有了一些了解,今天开始进一步了解Views,了解Views如何和Models交互以及了解模板(templates)。
打开main文件夹下的views.py,重新编写homepage函数,render的用法可在帮助文档 [1]中查看:
from django.shortcuts import render
from django.http import HttpResponse
from .models import Tutorial
# Create your views here.
def homepage(request):
return render(request=request,
template_name='main/home.html',
context={'tutorials':Tutorial.objects.all})
django会在你的app文件夹下寻找名称为"templates"的文件夹,为了避免有时模板重名的问题,我们在templates文件夹下在建立一个名称为main的文件夹。也就是mysite/main/templates/main。然后在这个文件夹下放置我们的html文件,新建home.html,并写入如下内容:
{% for t in tutorials %}
<p>{{ t.tutorial_title }}</p>
<p>{{ t.tutorial_published }}</p>
<p>{{ t.tutorial_content }}</p>
<br><br>
{% endfor %}
注意这里的for t in tutorials中的tutorials和views.py中的context={’tutorials': Tutorial.objects.all}中的tutorials时对应的。
我们进入admin添加一个名为‘WriteCode’,内容为如上html的内容的tutorial。保存后进入主页http://127.0.0.1:8000/,看到如下页面:

可以看到我们之前建立的两个tutorial的标题、时间、内容。但是第二个内容显示很乱,如何让其显示正常呢?只需要将home.html中的t.tutorial_context改为t.tutorial_context|safe即可,修改后显示如下:

此时虽然代码显示整齐了,但是没有代码高亮显示,如何让代码高亮显示呢?我们需要引入CSS/js,我们在安装TinyMCE时,就有了相应的CSS/js,我们只需引用即可。那么如何应用呢?django默认会在static的文件夹下寻找,就像在templates文件夹下寻找html文件一样,文件路径APPNAME/tinymce/APPNAME/。我们在使用之前需要先载入static文件夹,修改home.html文件:
{% load static %}
<link href="{% static 'tinymce/css/prism.css' %}" rel="stylesheet">
</head>
<body>
{% for t in tutorials %}
<p>{{ t.tutorial_title }}</p>
<p>{{ t.tutorial_published }}</p>
<p>{{ t.tutorial_content|safe }}</p>
<br><br>
{% endfor %}
<script src="{% static 'tinymce/js/prism.js' %}"></script>
</body>
显示效果如下,代码有了相应的颜色:

这一部分开始接触一些html语言,需要自己查阅相关教程进行学习。
参考链接:
[1] https://docs.djangoproject.com/zh-hans/2.1/topics/http/shortcuts/
[2] https://pythonprogramming.net/views-templates-django-tutorial/?completed=/admin-apps-django-tutorial/
Anaconda+django写出第一个web app(四)的更多相关文章
- Anaconda+django写出第一个web app(一)
在安装好Anaconda和django之后,我们就可以开始创建自己的第一个Web app,那么首先创建一个空文件夹,之后创建的文件都在这个文件夹内. 启动命令行进入此文件夹内,可以先通过如下命令查看一 ...
- Anaconda+django写出第一个web app(十一)
今天我们来学习给页面添加一个Sidebar,根据Sidebar跳转到相应的tutorial. 打开views.py,编辑single_slug函数: def single_slug(request, ...
- Anaconda+django写出第一个web app(十)
今天继续学习外键的使用. 当我们有了category.series和很多tutorials时,我们查看某个tutorial,可能需要这样的路径http://127.0.0.1:8000/categor ...
- Anaconda+django写出第一个web app(九)
今天来学习外键的使用,用外键来连接数据库中的两个表. 当我们的tutorials非常多的时候,目前的显示方式就会使得页面非常凌乱.我们可以考虑把这些教程分为不同的系列,页面只显示标题以及概要等信息,进 ...
- Anaconda+django写出第一个web app(三)
前面我们已经建立了模型Tutorial,也已经可以用Navicat Premium打开数据看查看数据,接下来我们通过建立admin账户来上传数据. 在命令行执行如下命令来创建用户: python ma ...
- Anaconda+django写出第一个web app(二)
今天开始建立App中的第一个Model,命名为Tutorial. Model的定义在main文件夹下的models.py中通过类进行,我们希望Tutorial这个model包含三个属性:标题.内容和发 ...
- Anaconda+django写出第一个web app(七)
今天来实现如何在页面弹出一些信息,比如注册成功后弹出注册成功的信息.这一点可以通过materialize里的Toasts来实现. django自带的messages可以告诉我们是否注册成功,以及注册失 ...
- Anaconda+django写出第一个web app(六)
今天学习如何写一个注册用户的界面. 上一节的导航栏中我们修改了导航栏右侧的文字为register并将路径设置为/register,内容如下: <li><a href="/r ...
- Anaconda+django写出第一个web app(八)
今天来实现网站的登入和登出功能. 首先我们需要在urls.py中添加路径,注意此处的路径和在导航栏中设置的文字路径保持一致: from django.urls import path from . i ...
随机推荐
- Fastqc使用说明
用FastQC检查二代测序原始数据的质量 2013-01-28 21:28:10| 分类: Bioinformatics | 标签:bioinformatics deep-seq |举报 | ...
- [转帖]通俗解释 AWS 云服务每个组件的作用
你有听说过 ContainerCache,ElastiCast 和 QR72 这些 AWS 的新服务吗? 没有就对了,这些都是我编的:) 不过,AWS 有 50 多个服务,从名称也不能看出这些服务是做 ...
- mysql实现消息队列
mysql之消息队列 消息队列:在消息的传输过程中保存消息的容器. 消息队列管理器在将消息从它的源中继到它的目标时充当中间人.队列的主要目的是提供路由并保证消息的传递:如果发送消息时接收者不可用, ...
- 使用 OpenGL API 播放 BIK 视频
BIK作为在游戏中广泛使用的视频格式,这里就非常有必要普及一下了 直接贴代码,看注释吧.有不懂的地方就留言提问吧 /** * * 解码BIK视频文件为像素数据,使用PBO更新OpenGL纹理,绘制纹理 ...
- DPDK环境搭建
一.环境要求 1.内核版本 >= 2.6.34: 2.glibc版本 >= 2.7 (ldd --version 查看glibc版本): 3.gcc版本 >= 4.9,一些gc ...
- Vivian's Problem UVA - 1323(梅林素数+状压二进制)
借鉴:https://blog.csdn.net/miku23736748/article/details/52135932 https://blog.csdn.net/acm_cxlove/arti ...
- BZOJ2436 [Noi2011]Noi嘉年华 【dp】
题目链接 BZOJ2436 题解 看这\(O(n^3)\)的数据范围,可以想到区间\(dp\) 发现同一个会场的活动可以重叠,所以暴力求出\(num[l][r]\)表示离散化后\([l,r]\)的完整 ...
- MySQL 性能比较测试:MySQL 5.6 GA -vs- MySQL 5.5
时间:2013年11月07日 ⁄ 分类: 数据库技术文档 ⁄ 我要吐槽发评论 MySQL 5.6 GA 发布了,毫无疑问,这是 MySQL 最棒的一个版本. 如果你还不清楚 MySQL 5.6 版 ...
- activity 与 service 之间的通信
activity和service通信:通过binder 举个我实际项目中的例子:在service中下载更新应用 首先是下载更新apk的service: public class UpdateVersi ...
- POI的XWPFParagraph.getRuns分段问题 多余逗号
POI的XWPFParagraph.getRuns分段问题 2018年08月28日 09:49:32 银爪地海贼 阅读数:376 这是我的模板 后台打印出来是分段的 造成这样的原因是${name} ...