Maison  >  Article  >  développement back-end  >  Vous enseigner des exemples détaillés d'utilisation de moteurs de modèles et de plug-ins de formulaire (python)

Vous enseigner des exemples détaillés d'utilisation de moteurs de modèles et de plug-ins de formulaire (python)

Y2J
Y2Joriginal
2017-04-26 10:12:361792parcourir

Après le contenu du premier chapitre, vous pouvez déjà créer quelques pages simples. Tout d'abord, utilisez cette méthode pour créer une page de connexion. Tout d'abord, vous devez créer une méthode de routage de connexion :

@app.route("/login",methods=["GET"])
def login():
 html="<form method=&#39;post&#39;>" \
 "<table>" \
 "<tr><td>请输入用户名</td><td><input type=&#39;text&#39; name=&#39;username&#39;/></td></tr>" \
 "<tr><td>请输入密码</td><td><input type=&#39;password&#39; name=&#39;password&#39;/></td></tr>" \
 "<tr><td><input type=&#39;submit&#39; value=&#39;登录&#39;/></td></tr>" \
 "</table>" \
 "</post>"
 return html
.

Après le retour de cette page, il y a une page de connexion simple, avec les résultats affichés comme suit :

Ensuite, il y a une page de retour après la connexion :

@app.route("/login",methods=["POST"])
def loginPost():
 username=request.form.get("username","")
 password=request.form.get("password","")
 if username=="test" and password=="123" :
 return "登录成功"
 else:
 return "登录失败"

Entrez Après test et 123, cela montre que la connexion est réussie

Fonctionnellement, c'est certainement implémenté, mais sous d'autres aspects, c'est difficile à dire que c'est un programme qui peut être réellement appliqué, même si, quels que soient les scripts js et les feuilles de style CSS, c'est un cauchemar en termes de maintenance simple, comme l'ajout d'une boîte de code de vérification, je ne pense pas que quiconque penserait que c'est le cas. un travail agréable.

Donc, tout d'abord, nous devons séparer la partie html de la page. Pour cela, flask fournit le moteur de modèle jinja2 pour y parvenir.

Le moteur de modèles jinja2 est également conforme à la convention la plus élémentaire de flask, c'est-à-dire qu'il existe une valeur par défaut de base dans de nombreuses configurations. Par rapport à jinja2, il existe une valeur par défaut la plus importante, à savoir le modèle. Le fichier est placé dans le dossier des modèles, bien que ce dossier puisse être personnalisé, pour l'instant, utiliser la valeur par défaut suffit.

D'accord, créez d'abord le dossier des modèles dans le répertoire racine du projet PyCharm, puis créez le fichier login.html dans le dossier. Bien sûr, la structure des répertoires est la suivante :

Entrez le code dans login.html comme suit :

<!DOCTYPE html>
<html>
 <head>
 <title>欢迎您登陆--牛博客</title>
 </head>
 <body>
 <form method=&#39;post&#39;>
 <table>
 <tr><td>请输入用户名</td><td><input type=&#39;text&#39; name=&#39;username&#39;/></td></tr>
 <tr><td>请输入密码</td><td><input type=&#39;password&#39; name=&#39;password&#39;/></td></tr>
 <tr><td><input type=&#39;submit&#39; value=&#39;登录&#39;/></td></tr>
 </table>
 </form>
 </body>
</html>
Le code est très simple, et il n'a pas été embelli en termes de style. En fait, pour moi à l'heure actuelle. , juste à cause de la perception intelligente, c'est suffisant. La raison est d'utiliser le modèle Ensuite, modifiez la méthode de connexion de default.py et le code est :

from flask import render_template #头部,引入模板渲染方法

@app.route("/login",methods=["GET"])
def login():
 return render_template("/login.html") 

 #渲染模板,默认找templates文件夹下的login.html文件
Depuis le code dans le modèle html. est le même que celui écrit directement dans le fichier py, actualisez-le à ce moment-là. L'effet d'affichage de la page est le même qu'avant. Bien que l'effet d'affichage n'ait pas changé de manière significative, il sera beaucoup plus pratique si vous modifiez un certain élément. dans le HTML en ce moment.

Le moteur de modèles jinja2 prend également en charge des fonctions plus puissantes, telles que l'utilisation d'index pour certaines instructions :

Utilisation de base

Modifier la valeur par défaut Une partie du code dans .py est :

from flask import render_template #页头,导入渲染函数

@app.route("/")
def index():
 return render_template("index.html",site_name=&#39;myblog&#39;)
Le code dans index.html est :

<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <title>{{site_name}}</title>
</head>
<body>
<h1>这个站点的名字为 {{site_name}} </h1>
</body>
</html>
la fonction render_template de flask prend en charge plusieurs paramètres, où le premier paramètre de la fonction est Nom du modèle, après quoi vous pouvez fournir plusieurs paramètres, qui sont tous des paires clé-valeur, pour fournir des données pour les variables du modèle. Dans cet exemple, la valeur de myblog est fournie pour site_name, et {{parameter name}} est utilisé dans le modèle pour représenter une variable

À ce stade, le résultat de sortie de l'adresse d'entrée du navigateur est :

Le modèle Jinja2 fournit également des filtres variables, tels que le code :
<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <title>myblog</title>
</head>
<body>
<h1>这个站点的名字为 myblog </h1>
</body>
</html>

Le résultat est :
<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <title>{{site_name|upper}}</title>
</head>
<body>
<h1>这个站点的名字为 {{site_name}} </h1>
</body>
</html>

Les filtres couramment utilisés sont les suivants
<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <title>myblog</title>
</head>
<body>
<h1>这个站点的名字为 myblog </h1>
</body>
</html>

safe Ne pas échapper

capitalize Capitaliser la première lettre minuscule Convertir en minuscule
majuscule Convertir en majuscule
trim Supprimer les espaces de fin
striptages Supprimer les balises html

Sauf ceci. De plus, les variables Jinja2 peuvent également être de types complexes, et vous pouvez même utiliser certaines méthodes courantes de types complexes, telles que :

Le résultat est :
<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <title>{{site_name[2:]}}</title> 
</head>
<body>
<h1>这个站点的名字为 {{site_name}} </h1>
</body>
</html>

<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <title>blog</title>
</head>
<body>
<h1>这个站点的名字为 myblog </h1>
</body>
</html>
Instructions de contrôle


Les instructions de contrôle sont les fonctions de base d'un modèle Jinja2 fournit également les fonctions correspondantes :

En plus. à ces usages de base, les modèles fournissent également des fonctions de macro pour la réutilisation de certains codes, comme l'écriture du code suivant dans le fichier macros.html
//选择
{% if name==&#39;test&#39; %}
 这是测试
{% else %}
 {{name}},你好
{% endif %}

//循环
<ul>
 {% for blog in blogs%}
 {{ blog.title }}
 {% endfor%}
</ul>

puis dans le modèle précédent :
{% macro render_title(blog)%}
 <li>{{blog.title}}</li>
{% endmacro%}

Résultats d'exécution Exactement les mêmes qu'avant
{% import &#39;macros.html&#39; as macros %}
<ul>
 {% for blog in blogs %}
 {{ macros.render_title(blog) }}
 {% endfor %}
</ul>

Jinja2 fournit également une fonctionnalité plus puissante, à savoir l'héritage de modèle. Cela ressemble personnellement un peu au framework Sitemesh de Java. Il doit d'abord créer un modèle de base. html :

La balise block signifie qu'elle peut être modifiée dans le sous-modèle. Dans cet exemple, les parties modifiables sont la tête, le titre et le corps. Voici le code du sous-modèle :
<!DOCTYPE html>
<html>
<head>
 {% block head %}
 <meta charset="UTF-8">
 <title>{% block title%} {% endblock %} - 牛博客</title>
 <script src="http://cdn.bootcss.com/jquery/2.2.4/jquery.min.js"></script>
 {% endblock %}
</head>
<body>
 {% block body %}
 {% endblock %}
</body>
</html>

Le résultat de l'exécution à ce moment est toujours :
{% extends "base.html" %}
{% block title %}{{site_name[2:]}}{% endblock %}
{% block head %}
 {{super()}}
{% endblock %}

{% block body %}
 <h1>这个站点的名字为 {{site_name}} </h1>
{% endblock %}

Maintenant qu'il existe un moteur de modèle, de toute façon, dans la mesure où La couche page est concernée, c'est déjà possible. Il est facile de créer de bonnes fonctions, mais évidemment l'interface actuelle n'est pas très belle. Le prochain chapitre intégrera le framework front-end actuel bootstrap et flask.
<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <title>blog</title>
</head>
<body>
<h1>这个站点的名字为 myblog </h1>
</body>
</html>

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn