Flask之手搓bootstrap翻页

最新推荐文章于 2024-02-02 18:02:34 发布

原创

最新推荐文章于 2024-02-02 18:02:34 发布 · 852 阅读

8 ·

CC 4.0 BY-SA版权

文章标签：

#flask #bootstrap #python

本文讲述了在使用Bootstrap框架的翻页组件时，作者选择手动实现而非直接依赖，通过Flask开发，涉及URL参数处理、数据传递和自定义翻页样式。

使用bootstrap框架的翻页组件时，记起在学习使用laravel框架的时候，只需要添加相应的功能代码，就可以直接使用翻页组件了，但缺少自定义，或者说自定义起来有点麻烦。

自己手搓翻页组件，不仅能加深对flask的认识，也更熟悉了前后代码之间的传递关系。

bootstrap翻页组件只有样式，如何把它变为自己想要的样子，做之前还需要在大脑里有个大概的形态。比如页面少时，有几页就显示几页，页数多时，就可以显示开始的和结束的页面，让人可以一目了然的知道，一共有多少页码。

页数少的时候，像这样：

页面多的时候，像这样：

这里面的数据，都是从omdb api里拉取的，详情可以看这个：flask之jinjia模板语法，拉取omdb api-优快云博客

这次手搓翻页组件、控件，主要是为了自己的需求来做的。当当前页为第一页时，前翻按钮为禁用状态，当当前页为最后一页的时候，向后翻的按钮同样为禁用状态。

上代码：

from flask import Flask, render_template, request
import requests
import math
import json

app = Flask(__name__)


@app.route('/', methods=["GET"])
# @app.route('/?s=<s>&page=<page>', methods=["GET"])
def main():
    s = request.args.get("s")
    page = request.args.get("page")
    if page is None:
        page = 1
    else:
        page = int(request.args.get("page"))
    if s is None:
        s = 'superman'
    # Here is your key: 4ee0241e
    # OMDb API: http://www.omdbapi.com/?i=tt3896198&apikey=4ee0241e
    # rawData = requests.get("http://www.omdbapi.com/?apikey=4ee0241e&s=batman&page=1")
    rawData = requests.get(f"http://www.omdbapi.com/?apikey=4ee0241e&s={s}&page={page}")
    movies = rawData.json()
    pages = math.ceil(int(movies["totalResults"]) / 10)
    data = dict(
        movies=movies,
        active1="active",
        active2="",
        pages=pages,
        page=page,
        s=s,
    )
    return render_template("index.html", data=data)


@app.route('/', methods=["POST"])
def search():
    s = request.form["name"]
    page = 1
    rawData = requests.get(f"http://www.omdbapi.com/?apikey=4ee0241e&s={s}&page={page}")
    movies = rawData.json()
    pages = math.ceil(int(movies["totalResults"]) / 10)
    data = dict(
        movies=movies,
        active1="active",
        active2="",
        pages=pages,
        page=page,
        s=s,
    )
    return render_template("index.html", data=data)


@app.route('/<imdbID>')
def movie_by_title(imdbID):
    # rawData = requests.get("http://www.omdbapi.com/?apikey=4ee0241e&i={}".format(imdbID))
    rawData = requests.get(f"http://www.omdbapi.com/?apikey=4ee0241e&i={imdbID}")
    movie = rawData.json()
    data = dict(
        movie=movie,
        ac