整合营销服务商

电脑端+手机端+微信端=数据同步管理

免费咨询热线:

Django 使用模板 templates

Django 使用模板 templates

板作为公共页面,可以被其他页面引用并重写,可以更快速编辑页面。

1,编辑myweb\web\views.py,内容如下:

from django.shortcuts import render
 
 def home(request):
     return render(request, 'home.html')

前面在介绍创建简单的页面时,导入的是HttpResponse,直接向页面输出内容,而这里导入的是render。


2,将视图与网址对应

修改E:\myweb\myweb\urls.py:

from django.conf.urls import url
 from django.contrib import admin
 import view
 from web import views
 urlpatterns=[
     url(r'^$', views.home),
 ]

3,在myweb\web目录中创建templates目录,在templates目录创建base.html,home.html。

Base.html将作为一个模板文件,所有的html文件都可以继承该文件,编辑base.html的内容如下:


<!DOCTYPE html>

<head>

<meta http-equiv="Content-Type" content="text/html" charset="UTF-8">

<meta name="viewport" content="width=device-width, height=device-height,initial-scale=1.0">

<meta http-equiv="X-UA-Compatible" content="ie=edge">

<title>李老道自学网</title>

<link rel="stylesheet" href="./static/css/style.css">

<link rel="shortcut icon" href="/static/favicon.ico">

</head>

<body>

<header class="g-hd">

<span class="logo nosign"><a href="/">李老道自学网</a></span>

{% block title %}

<div class="fr">李老道自学网</div>

{% endblock %}

</header>

<main class="g-mn">

{% block content %}

<div>李老道自学网</div>

{% endblock %}

</main>

</body>

</html>

模板中用到 {% block xxx %},代表被继承引用后,是可以被替换的内容。如果不替换则会显示模板中的内容。以下home.html将继承base.html并替换{% block content %}中的内容。

编辑home.html的内容如下:


{% extends 'base.html' %}

{% block title %}

<nav>

<ul>

{# 显示所有分类 #}

<li><a href="?">测试基础</a></li>

<li><a href="?">python2</a></li>

</ul>

</nav>

{% endblock %}


{% block content %}

<aside class="g-sd">

<section class="u-card">

<div class="card-hd">

<span class="card-tit">

{{ type_name }}

</span>

</div>

<div class="card-bd">

<ul class="m-btnList">

{# 显示分类下的章节 #}

<li><a href="?">测试相关概念</a></li>

</ul>

</div>

</section>

<section class="u-card">

<div class="card-hd">

<span class="card-tit">

说明

</span>

</div>

<div class="card-bd">

<ul class="m-btnList">

<li>

本站所有内容均是本人学习笔记,只是将学习过程记录下来,供大家分享,并非教学式教程。

</li>

</ul>

</div>

</section>

</aside>

<article class="m-article">

{# 显示章节下的文章 #}

xxxxxxxxxxx

</article>

{% endblock %}


这里{% extends 'base.html' %}代表继承base.html模板,而{% block title %},{% block content %}块中的内容将替换掉模板中的内容。

要从零开始开发一个开源项目,这个项目的目的很简单:新人可以练手,一步一步搭建项目,把时下流行的技术整合进来,在用这些技术的特性来实现具体业务功能,而对于有经验的老鸟可以把自学的技术在项目中得以实践。

在这里插入图片描述

琢磨了挺长时间,前段时间工作比较忙、家中事情也比较多,导致最近才着手弄。

感兴趣的同学可以关注一波,项目进度可能会缓慢,但脚步绝不会停止

作为一个后端程序员,虽然平时也会做一些管理后台的页面,可那都是本着能用就行的原则,美观都是次要的。但项目要对外开源这可是门面,不美美哒多没面子,所以选一个酷炫的页面模板成了首要任务,选了10个模板出来,大伙给参谋下。

源码获取方式:关注转发之后私信回复【源码】来免费获取到这10个后台模板源码

evExpress WinForm拥有180+组件和UI库,能为Windows Forms平台创建具有影响力的业务解决方案。DevExpress WinForms能完美构建流畅、美观且易于使用的应用程序,无论是Office风格的界面,还是分析处理大批量的业务数据,它都能轻松胜任!

DevExpress WinForms Subscription官方最新版免费下载试用,历史版本下载,在线文档和帮助文件下载-慧都网

许多DevExpress WinForm数据感知控件都支持HTML & CSS模板(包括WinForms Data Grid、WinForms Gantt控件),这些控件显示纯数据(其中每个数据字段存储简单值,如数字、字符串、布尔值等)时,数据绑定语法允许开发人员不受限制地构造模板。

<div>${ModelName}</div>
<div>${Price}</div>
<div>$Available: {InStock}</div>
<img src="${Photo}"/>

有些数据源还可能包含存储项集合的数据字段:List、数组、数据集等,数据网格显示具有简单属性(Title、Manager、Due Data)的任务,以及一个集合属性(“Members”属性返回分配给该卡片的员工列表)。

在以前的版本中,可以通过在CustomItemTemplate事件中操作模板来显示来自这些属性的数据。这意味着开发人员需要手动检查这个特定数据记录的收集容量,为每个项目创建一个HTML元素,并用真正的HTML标记替换预先添加的假元素。

void OnCustomItemTemplate(object sender, TileViewCustomItemTemplateEventArgs e) {
var task=tileView1.GetRow(e.RowHandle) as EmployeeTask;
var sb=new StringBuilder();
foreach(var member in task.Members) {
sb.Append("<div class=\"initials\">");
sb.Append(member.Initials);
sb.Append("</div>");
}
e.HtmlTemplate.Template=e.HtmlTemplate.Template.Replace("", sb.ToString());
}

在下一个重大版本(v22.2)更新中,开发人员可以避免手动定制模板,并利用更原生的方法。标记是唯一的DevExpress元素,它允许开发人员指定一个集合属性,其中的项需要可视化,以及必须应用于这些项的模板。

  • 第1至3行 - 应用于每个集合项的模板,注意这些模板必须在控件的主模板之前声明。${Initials}绑定告诉模板它应该显示"Initials"属性的值。title属性允许集合项显示具有“FullName”属性值的提示。
  • 第18行和第19行 - <dx-collection>标记。Items属性指向集合属性。ItemTemplate属性指定必须应用于集合项的模板ID。

除了这个核心功能,开发人员可以利用条件CSS格式,在之前的文章中有介绍:如何使用HTML&CSS模板的条件样式?

dx-class属性支持集合的四个惟一属性:

  • dx-first和dx-last - 应用于集合的第一个和最后一个项,如果集合只有一个项,则忽略这两种样式。
  • dx-odd 和 dx-even — 用于索引为奇数和偶数的项,第一个集合项是偶数(索引为0)..