前言

前端文件下载

链接https://pan.baidu.com/s/1Ju5hhhhy5pcUMM7VS3S5YA?pwd=6666%C2%A0

知识点

1. 在路由中渲染前端页面

2. 使用 JinJa 2 模板实现前端代码复用

一、auth.py

from flask import render_template  @bp.route('/register', methods=['GET']) def register():     return render_template("register.html")

@bp.route('/register', methods=['GET'])

这一行代码是一个装饰器，用于定义一个路由：

• @bp.route：bp 是一个蓝图对象（Blueprint），用于将相关的路由和视图函数组织在一起。route 方法将 URL 路径与视图函数绑定。
• '/register'：URL 路径，当用户访问 http:///register 时，这个路由会被触发。
• methods=['GET']：指定 HTTP 方法，这里仅允许 GET 请求。GET 请求通常用于从服务器获取数据，如加载一个网页。

def register():

定义一个名为 register 的视图函数。当用户访问 '/register' 路径时，这个函数会被调用。

return render_template("register.html")

视图函数的返回值，用于呈现注册页面：

• render_template：Flask 提供的一个函数，用于渲染模板。它会从模板文件夹中找到指定的 HTML 文件，渲染它并返回给客户端。
• "register.html"：模板文件的名称。Flask 会在应用的模板文件夹中查找这个文件，并将其渲染为 HTML 页面。

完成后访问页面如下 

二、副模板

新建一个 base.html 文件

                            {% block head %}     	     {% endblock %}                  
         {% block body %}         	         {% endblock %}     
   

{% block head %} ... {% endblock %}

这是一个模板块定义，具体用途如下：

• {% ... %}：这是Jinja2模板语言的语法，用于包含控制结构（如循环、条件语句）和模板继承块。
• block head：定义一个名为 head 的模板块。block 是Jinja2的关键字，用于定义可重写的内容区域。head 是块的名称，可以是任意的，但通常与HTML文档结构相关。
• {% endblock %}：结束块定义。所有在 block head 和 endblock 之间的内容都是这个块的一部分。

三、register.html

修改源代码

{% extends "base.html" %}  {% block title %} 	问答平台-注册 {% endblock %}  {% block head %}  {% endblock %}  {% block body %} 	
         
             
             
                 
                     
                         邮箱                                                  我们不会把邮箱用于其他用户                     
                     
                         验证码                         
                                                          
                                 获取验证码                             
                         
                     
                     
                         用户名                                              
                     
                         密码                                              
                     
                         确认密码                                              
                     立即注册                 
             
             
         
     
 {% endblock %}