美文网首页Flask交流
五、继承和block

五、继承和block

作者: 十柒年 | 来源:发表于2018-08-28 16:30 被阅读89次

1.什么是继承

继承是面向对象程序设计中最重要的概念之一。继承允许我们根据一个类来定义另一个类,这使得创建和维护应用程序变得更容易。同时也有利于重用代码和节省开发时间。在python中,模板直接可以进行继承,python代码里也支持继承。如下图。

class Person(object):
    name = ''
    age = 0

class Student(Person):
    pass

在上面定义了一个Person类,下面有一个Student类来继承这个Person类,那么在模板中如何进行继承呢?最常见的就是导航栏了,当进行页面切换的时候,导航栏一般是不变的,要是每个页面都把导航栏写一遍,那就太麻烦了,也不好修改,比如微博。

image.png
好了看模板中如何用继承呢?首先我们需要添加页面,一个index.html 首页。一个login.html登录也,还有一个base.html就是咱们的基类,也就是模板页了。
首先看下base.html写法。
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{% block titile %}{% endblock %}</title>
     <style>
        .nav{
            background:#3a3a3a;
            height: 65px;
        }
        ul{
            overflow: hidden;
        }
        ul li{
            float: left;
            list-style: none;
            padding: 0 10px;
            line-height: 65px;
        }
        ul li a{
            color: #ffffff;
        }
    </style>
</head>
<body>
<div class="nav">
    <ul>
        <li><a href="#">首页</a></li>
        <li><a href="#">发布问答</a></li>
    </ul>
</div>
{% block main %}
{% endblock %}
</body>
</html>

这里我们看到,我们在title里和div下面定义了两个block,这个就是为了扩展页面内容的写法,然后看下index.html

{% extends 'base.html' %}
{% block titile %}
首页
{% endblock %}
{% block main %}
<h1>这里是首页</h1>
{% endblock %}

注意extends 'base.html' 的写法,这里就是继承了base页面,而下面的block则是扩展写法。同理看下login页面。

{% extends 'base.html' %}
{% block titile %}
登录页面
{% endblock %}
{% block main %}
<h1>这里是登录页面</h1>
{% endblock %}

然后看看后台写法。

from flask import Flask, render_template

app = Flask(__name__)


class Person(object):
    name = ''
    age = 0

class Student(Person):
    pass

@app.route('/')
def index():
    return render_template('index.html')

@app.route('/login/')
def login():
    return render_template('login.html')

if __name__ == '__main__':
    app.run(debug=True)

嗯,直接定义了两个视图函数。接下来看下运行效果。

image.png
当我们输入/login的时候。
image.png
里面黑色的部分就是base.html 页面里写好的效果,index.html 和login.html 都继承了这个页面,并在base页面的继承之上,做了一些改动。有一些主要注意,引入了extends之后,子页面中的代码必须都要写在父页面定义好的block块中了,否则页面是看不到效果的。好了今天就先说这么多。源码链接在这:链接:https://pan.baidu.com/s/1xvzJufWArzTbKCKNJntFUA 密码:pzzs
Study hard and make progress every day.

更多学习资料请关注"爱游戏爱编程"。


爱游戏爱编程.jpg

相关文章

网友评论

    本文标题:五、继承和block

    本文链接:https://www.haomeiwen.com/subject/uxlqwftx.html