flask实践之“盗版豆瓣评分小程序完整版”

最新推荐文章于 2021-10-24 23:55:47 发布

LCY133

最新推荐文章于 2021-10-24 23:55:47 发布

阅读量334

点赞数

分类专栏： # flask框架

本文链接：https://blog.csdn.net/LCY133/article/details/109240043

版权

flask

flask框架专栏收录该内容

35 篇文章 1 订阅

订阅专栏

注：远离浑身散发负能量的人，多与正能量爆棚的人交流，最近真的是找到原因了
在本文中，进行了小程序的优化，加入了一些宏操作，加入更多选项，可以通过点击更多进入更复杂的页面。将一个完整的程序，分为多个小的子程序，使程序的逻辑更加清晰。
一个好的方法：“ctrl+shift+r” 在加载出来网页后，可以通过此方式清缓存，但是：有些网页一旦这样清缓存就不能再将文件加载出来了。

关于宏操作：
定义宏：在本文件中定义宏的位置是在文件macro.html中，

{% macro itemGroup(thumbnail, title, rating)%}
    <!--  图片 星星  标题的宏  -->
        <div class="item-group">
            <img src="{{ thumbnail }}" alt="" class="thumbnail">
            <p class="item-title">{{ title }}</p>
            <p class="item-rating">
                {% set lights = ((rating|int)/2)|int %}
                {% set halflight =  (rating|int)%2 %}
                {% set grays = 5 - lights - halflight %}
                {% for light in range(0, lights)%}
                <img src="{{url_for('static', filename='images/rate_light.png')}}" alt="">
                {% endfor %}
                {% for half in range(0, halflight)%}
                <img src="{{url_for('static', filename='images/rate_half.jpg')}}" alt="">
                {% endfor %}
                {% for gray in range(0, grays)%}
                <img src="{{url_for('static', filename='images/rate_gray.png')}}" alt="">
                {% endfor %}
                {{ rating }}
            </p>
        </div>
    {% endmacro %}

使用宏：

{{ itemGroup(item.thumbnail, item.title, item.rating) }}

模板的继承 extends block：
在基类中定义：

<title>{% block Title %}
    {% endblock %}</title>

使用该基类中的block

{% extends  'base.html' %}
{% block Title %}
    电影
{% endblock %}

完整代码：
定义宏的文件，宏文件macro.html显示如下，在该文件中定义了两个宏itemGroup和listGroup：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    {% macro itemGroup(thumbnail, title, rating)%}
    <!--  图片 星星  标题的宏  -->
        <div class="item-group">
            <img src="{{ thumbnail }}" alt="" class="thumbnail">
            <p class="item-title">{{ title }}</p>
            <p class="item-rating">
                {% set lights = ((rating|int)/2)|int %}
                {% set halflight =  (rating|int)%2 %}
                {% set grays = 5 - lights - halflight %}
                {% for light in range(0, lights)%}
                <img src="{{url_for('static', filename='images/rate_light.png')}}" alt="">
                {% endfor %}
                {% for half in range(0, halflight)%}
                <img src="{{url_for('static', filename='images/rate_half.jpg')}}" alt="">
                {% endfor %}
                {% for gray in range(0, grays)%}
                <img src="{{url_for('static', filename='images/rate_gray.png')}}" alt="">
                {% endfor %}
                {{ rating }}
            </p>
        </div>
    {% endmacro %}

    {% macro listGroup(module_title, items, category=category) %}
    <div class="item-list-group">
            <div class="item-list-top">
                <span class="module-title">{{ module_title }}</span>
                <a href="{{ url_for('movie_list', category=category) }}" class="more-btn">更多</a>
            </div>
            <div class="list-group">
                {% for item in items[0:3] %}
<!--        调用宏itemGroup        -->
                {{ itemGroup(item.thumbnail, item.title, item.rating) }}
                {% endfor %}
            </div>
        </div>
    {% endmacro %}
</body>
</html>

基类文件base,定义文件头部尾部，引入宏文件中的itemGroup listGroup
在body中使用content模块，

{% from 'macro.html' import itemGroup,listGroup %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{% block Title %}
    {% endblock %}</title>
    <link rel="stylesheet" href="{{ url_for('static',filename='css/base.css') }}">
    <link rel="stylesheet" href="{{ url_for('static',filename='css/item.css') }}">
</head>
<body>
    {% block header_title %}
    <h1>豆瓣小程序评分</h1>
    {% endblock %}
    <div class="container">
        <div class="search-group">
            <input type="text" class="search-input">
        </div>
        {% block content %}
        {% endblock %}
    </div>
</body>
</html>

子程序引入基类程序中的内容，是实现页面主要功能的代码：
index.html

{% extends  'base.html' %}

{% block header_title %}
    <h1>豆瓣小程序评分</h1>
{% endblock %}

{% block content %}
    {{ listGroup('电影',movies,1) }}
<hr>
    {{ listGroup('电视剧',tvs,2) }}
{% endblock %}

实现“更多”部分的代码： list.html

{% extends  'base.html' %}
{% block Title %}
    电影
{% endblock %}

{% block header_title %}
    <h1>电影</h1>
{% endblock %}

{% block content %}
    {% for item in items %}
    {{ itemGroup(item.thumbnail, item.title, item.rating) }}
    {% endfor %}
{% endblock %}

python文件导入参数实现功能：

#! C:\Python\Python36
# -*- coding: utf-8 -*-
# @Time : 2020/10/20 14:00
# @Author : liuchengyong
# @File : douban.py
# @Software: PyCharm
from flask import Flask,render_template,url_for,request

app = Flask(__name__)
# 电影
movies = [
    {
        'id': '11211',
        'thumbnail': 'https://img3.doubanio.com/view/movie_poster_cover/lpst/public/p2499792043.webp',
        'title': u'王牌特工2：黄金圈',
        'rating': u'7.3',
        'comment_count': 12000,
        'authors': u'科林·费尔斯 / 塔伦·埃格顿 / 朱丽安·摩尔'
    },
    {
        'id': '34532',
        'title': u'羞羞的铁拳',
        'thumbnail': u'https://img1.doubanio.com/view/movie_poster_cover/lpst/public/p2499793218.webp',
        'rating': u'7.6',
        'comment_count': 39450,
        'authors': u'艾伦/马丽/沈腾'
    },
    {
        'id': '394558',
        'title': u'情圣',
        'thumbnail': u'https://img3.doubanio.com/view/movie_poster_cover/mpst/public/p2409022364.jpg',
        'rating': u'6.3',
        'comment_count': 38409,
        'authors': u'肖央 / 闫妮 / 小沈阳'
    },
    {
        'id': '9384089',
        'title': u'全球风暴',
        'thumbnail': u'https://img3.doubanio.com/view/movie_poster_cover/lpst/public/p2501863104.webp',
        'rating': u'7.4',
        'comment_count': 4555,
        'authors': u'杰拉德·巴特勒/吉姆·斯特'
    },
    {
        'id': '26921827',
        'title': u'大卫贝肯之倒霉特工熊',
        'thumbnail': u'https://img3.doubanio.com/view/movie_poster_cover/mpst/public/p2408893200.jpg',
        'rating': u'4.3',
        'comment_count': 682,
        'authors': u'汤水雨 / 徐佳琪 / 杨默'
    },
    {
        'id': '26287884',
        'title': u'追龙',
        'thumbnail': u'https://img3.doubanio.com/view/movie_poster_cover/lpst/public/p2499052494.webp',
        'rating': u'7.5',
        'comment_count': 33060,
        'authors': u'查理兹·塞隆 / 阿特·帕金森 / 拉尔夫·费因斯'
    }
]
#电视剧
tvs = [
    {
        'id': '235434',
        'title': u'鬼吹灯之精绝古城',
        'thumbnail': u'https://img3.doubanio.com/view/movie_poster_cover/lpst/public/p2404604903.jpg',
        'rating': u'8.4',
        'comment_count': 49328,
        'authors': u'靳东 / 陈乔恩 / 赵达 / 付枚 / 金泽灏 /'
    },
    {
        'id': '9498327',
        'title': u'孤芳不自赏',
        'thumbnail': u'https://img1.doubanio.com/view/movie_poster_cover/lpst/public/p2407425119.jpg',
        'rating': u'3.7',
        'comment_count': 8493,
        'authors': u'钟汉良 / 杨颖 / 甘婷婷 / 孙艺洲 / 亓航 /'
    },
    {
        'id': '26685451',
        'title': u'全球风暴',
        'thumbnail': u'https://img3.doubanio.com/view/movie_poster_cover/lpst/public/p2501769525.webp',
        'rating': u'8.2',
        'comment_count': 345,
        'authors': u' 卢克·崔德威 / 琼安·弗洛加特 / 露塔·格德米纳斯 / 安东尼·海德 / 卡罗琳·古多尔 /'
    },
    {
        'id': '235434',
        'title': u'其他人',
        'thumbnail': u'https://img3.doubanio.com/view/movie_poster_cover/lpst/public/p2371503632.jpg',
        'rating': u'7.6',
        'comment_count': 25532,
        'authors': u'杰西·普莱蒙 / 莫莉·香侬 / 布莱德利·惠特福德 / Maude Apatow / 麦迪逊·贝蒂 /'
    },
    {
        'id': '48373095',
        'title': u'全员单恋',
        'thumbnail': u'https://img1.doubanio.com/view/movie_poster_cover/lpst/public/p2367986708.jpg',
        'rating': u'6.4',
        'comment_count': 2483,
        'authors': u'伊藤沙莉 / 中川大志 / 上原实矩 / 森绘梨佳 / 樱田通 /'
    },
    {
        'id': '292843',
        'title': u'废纸板拳击手',
        'thumbnail': u'https://img1.doubanio.com/view/movie_poster_cover/lpst/public/p2380194237.jpg',
        'rating': u'8.2',
        'comment_count': 23456,
        'authors': u'托马斯·哈登·丘奇 / 泰伦斯·霍华德 / 波伊德·霍布鲁克 / 瑞斯·维克菲尔德 / 马尔洛·托马斯 /'
    }
]

@app.route('/')
def hello():
    context = {
        'movies':movies,
        'tvs':tvs
    }
    return render_template('index.html',**context)

@app.route('/list/')
def movie_list():
    items = None
    category = int(request.args.get('category'))
    print(type(category))
    if category == 1:
        items = movies
    else:
        items = tvs
    return render_template('list.html',items = items)

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