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')
启动服务,查看首页,如下截图。