36、主机资产管理–模板继承
模板继承
Python函数 变=>参数 不变=>函数体
format 变=>字符串内占位元素的值 不变=>字符串格式
变 菜单的谁选中，显示谁的内容
不变 页面结果，菜单项
html 不变 把变的内容通过占位符进行占位
使用html把变的东西传递
template.html
<html> <body>{% block body %}{% endblock %}</body></html>
block endblock => name
a.html
{% extends “base.html” %}
{% block body %}A {% endblock %}
b.html
{% extends “base.html” %}
{% block body %}B {% endblock %}
(py36django2) [root@www pycharm_project_827]# cat templates/base.html 设置基础模板
{% load static %}
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<title>{% block title %}{% endblock %}</title>
<link rel="stylesheet" type="text/css" href="{% static 'bootstrap-3.4.1-dist/css/bootstrap.min.css' %}" />
<link rel="stylesheet" type="text/css" href="{% static 'sweetalert-1.1.0/dist/sweetalert.css' %}" />
<link rel="stylesheet" type="text/css" href="{% static 'DataTables-1.10.21/media/css/jquery.dataTables.min.css' %}" />
<link rel="stylesheet" type="text/css" href="{% static 'DataTables-1.10.21/media/css/dataTables.bootstrap.min.css' %}" />
{% block links %}{% endblock %}
<style>
body{
padding: 70px;
}
</style>
{% block style %}{% endblock %}
</head>
<body>
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">CMDB</a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="{% block nav_user %}{% endblock %}"><a href="{% url 'user:index' %}">用户管理</a></li>
<li class="{% block nav_asset %}{% endblock %}"><a href="{% url 'asset:index' %}">资产管理</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a>当前登录用户是：{{ request.session.user.name }}</a></li>
<li class="active"><a href="/user/logout/">退出登录</a></li>
</ul>
</div><!--/.nav-collapse -->
</div>
</nav>
<div class="container">
{% block containter %}{% endblock %}
</div> <!-- /container -->
<!-- Modal -->
{% block dialog %}{% endblock %}
<script type="text/javascript"src="{% static 'jquery/jquery-1.12.4.js' %}"></script>
<script type="text/javascript"src="{% static 'bootstrap-3.4.1-dist/js/bootstrap.min.js' %}"></script>
<script type="text/javascript"src="{% static 'sweetalert-1.1.0/dist/sweetalert.min.js' %}"></script>
<script type="text/javascript"src="{% static 'DataTables-1.10.21/media/js/jquery.dataTables.js' %}"></script>
<script type="text/javascript"src="{% static 'DataTables-1.10.21/media/js/dataTables.bootstrap.min.js' %}"></script>
{% block script %}{% endblock %}
<script>
jQuery(document).ready(function () {
{% block js %}{% endblock %}
});
</script>
</body>
</html>
(py36django2) [root@www pycharm_project_827]# cat asset/templates/asset/index.html 资产管理首页
{% extends “base.html” %}
{% block title %}资产管理{% endblock %}
{% block nav_asset %}active{% endblock %}
{% block containter %}资产管理{% endblock %}
(py36django2) [root@www pycharm_project_827]# cat asset/views.py 修改视图函数
from django.shortcuts import render, HttpResponse
# def index(request):
# return HttpResponse(‘asset:index’)
def index(request):
return render(request, ‘asset/index.html’)
启动服务，查看首页，如下截图。
原创文章，作者：ItWorker，如若转载，请注明出处：https://blog.ytso.com/289911.html