前面对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(四)的更多相关文章

  1. Anaconda+django写出第一个web app(一)

    在安装好Anaconda和django之后,我们就可以开始创建自己的第一个Web app,那么首先创建一个空文件夹,之后创建的文件都在这个文件夹内. 启动命令行进入此文件夹内,可以先通过如下命令查看一 ...

  2. Anaconda+django写出第一个web app(十一)

    今天我们来学习给页面添加一个Sidebar,根据Sidebar跳转到相应的tutorial. 打开views.py,编辑single_slug函数: def single_slug(request, ...

  3. Anaconda+django写出第一个web app(十)

    今天继续学习外键的使用. 当我们有了category.series和很多tutorials时,我们查看某个tutorial,可能需要这样的路径http://127.0.0.1:8000/categor ...

  4. Anaconda+django写出第一个web app(九)

    今天来学习外键的使用,用外键来连接数据库中的两个表. 当我们的tutorials非常多的时候,目前的显示方式就会使得页面非常凌乱.我们可以考虑把这些教程分为不同的系列,页面只显示标题以及概要等信息,进 ...

  5. Anaconda+django写出第一个web app(三)

    前面我们已经建立了模型Tutorial,也已经可以用Navicat Premium打开数据看查看数据,接下来我们通过建立admin账户来上传数据. 在命令行执行如下命令来创建用户: python ma ...

  6. Anaconda+django写出第一个web app(二)

    今天开始建立App中的第一个Model,命名为Tutorial. Model的定义在main文件夹下的models.py中通过类进行,我们希望Tutorial这个model包含三个属性:标题.内容和发 ...

  7. Anaconda+django写出第一个web app(七)

    今天来实现如何在页面弹出一些信息,比如注册成功后弹出注册成功的信息.这一点可以通过materialize里的Toasts来实现. django自带的messages可以告诉我们是否注册成功,以及注册失 ...

  8. Anaconda+django写出第一个web app(六)

    今天学习如何写一个注册用户的界面. 上一节的导航栏中我们修改了导航栏右侧的文字为register并将路径设置为/register,内容如下: <li><a href="/r ...

  9. Anaconda+django写出第一个web app(八)

    今天来实现网站的登入和登出功能. 首先我们需要在urls.py中添加路径,注意此处的路径和在导航栏中设置的文字路径保持一致: from django.urls import path from . i ...

随机推荐

  1. 性能分析_linux服务器CPU_CPU利用率

    CPU度量 1.  指标范围 1.1  User mode CPU utilization+ System mode CPU utilization 合理值:60-85%,如果在一个多用户系统中us+ ...

  2. 对一致性Hash算法及java实现(转)

    一致性Hash算法 关于一致性Hash算法,在我之前的博文中已经有多次提到了,MemCache超详细解读一文中"一致性Hash算法"部分,对于为什么要使用一致性Hash算法.一致性 ...

  3. SQLSERVER 修改实例名以及架构信息

    1. GUI的方式 后者是 alter database 的方式修改 instance的名字 2. 在全局的安全性下面创建用户. 3. 在实例的安全性下面创建架构和用户(架构名与用户名一直, 使用新实 ...

  4. Navicat for MySQL和Navicat Premium之间的区别

    首先两款软件都可以用来管理数据库链接MySQL和MariaDB 相对于新手或者前端工程师使用Navicat for MySQL就够了,功能相对于Navicat Premium比较少Navicat fo ...

  5. Eclipse HTML Editor

    需插件: 1.GEF 3.1 安装程序下载 下载地址: http://download.eclipse.org/tools/gef/downloads/drops/R-3.1-200507071758 ...

  6. 【Java并发编程】之十三:生产者—消费者模型

    生产者消费者问题是线程模型中的经典问题:生产者和消费者在同一时间段内共用同一存储空间,生产者向空间里生产数据,而消费者取走数据. ​ 这里实现如下情况的生产--消费模型: ​ 生产者不断交替地生产两组 ...

  7. hdu1542 Atlantis (线段树+矩阵面积并+离散化)

    There are several ancient Greek texts that contain descriptions of the fabled island Atlantis. Some ...

  8. SpringBoot之使用jpa/hibernate

    Springboot版本是2.1.3.RELEASE 1.依赖 List-1.1 <dependency> <groupId>org.springframework.boot& ...

  9. BZOJ 2724 蒲公英 | 分块模板题

    题意 给出一个序列,在线询问区间众数.如果众数有多个,输出最小的那个. 题解 这是一道分块模板题. 一个询问的区间的众数,可能是中间"整块"区间的众数,也可能是左右两侧零散的数中的 ...

  10. 毕业设计预习:VHDL入门知识学习(一) VHDL程序基本结构

    VHDL入门知识学习(一) VHDL程序基本结构 简介 VHDL程序基本结构 简介 概念: HDL-Hardware Description Language-硬件描述语言-描述硬件电路的功能.信号连 ...