标签:引擎 jinjia 集中 and end favicon vba nal 显示
默认情况下,Flask在templates文件夹中寻找模板,使用render_template将该引擎集中到程序中
一个超简陋的 Jinjia2 模板:
<h1>Hello, {{name}}!<h1>
{{ }}表示一个变量,值从渲染模板时使用的数据中获取
可使用过滤器修改变量:{{name|capitalize}}
safe注意:
过滤器名 | 说明 |
---|---|
safe | 渲染时不转义 |
capitalize | 把值的首字母转换成大写,其他字母转换成小写 |
lower | 把值转换成小写形式 |
upper | 把值转换成大写形式 |
title | 把值中每个单词的首字母都转换成大写 |
trim | 把值的首尾空格去掉 |
striptags | 渲染之前把值中所有的HTML标签都删掉 |
变量:{{}}
语句:{% %}
+ {% end啥子 %}
在模板中使用条件控制语句
<!-- 条件控制语句 -->
{% if user %}
Hello, {{ user }}!
{% else %}
Hello, Stranger!
{% endif %}
<!-- for循环 -->
<ul>
{% for comment in comments %}
<li>{{ comment }}</li>
{% endfor %}
</ul>
{% include 'commen.html' %}
<!-- 宏:{% macro 函数名() %}-->
{% macro render_comment(comment) %}
<li>{{ comment }}</li>
{% endmacro %}
{% import 'macros.html' as macros %}
base.html 基模板:
<html>
<head>
{% block head %}
<title>{% block title %}{% endblock %} - My Application</title>
{% endblock %}
</head>
<body>
{% block body %}
{% endblock %}
</body>
</html>
衍生模板:
{% extends "base.html" %}
{% block title %}Index{% endblock %}
{% block head %}
{{ super() }}
<style>
</style>
{% endblock %}
{% block body %}
<h1>Hello, World!</h1>
<% endblock %}
安装:pip install flask-bootstrap
Bootstrap官方文档:https://v3.bootcss.com/css/#less
初始化
from flask_bootstrap import Bootstrap
bootstrap = Bootstrap(app)
{% extends "bootstrap/base.html" %}
{% block title %}Flasky{% endblock %}
{% block navbar %}
<div class="navbar navbar-inverse" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/">Flasky</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a href="/">Home</a></li>
</ul>
</div>
</div>
</div>
{% endblock %}
{% block content %}
<div class="container">
{% block page_content %}{% endblock %}
</div>
{% endblock %}
{% block 模块名称 %} + {% endblock %}
块名 | 说明 |
---|---|
doc | 整个HTML文档 |
html_attribs | <html>标签属性 |
html | <html>标签内容 |
head | <head>标签内容 |
title | <title>标签内容 |
metas | 一组<meta>标签 |
stytles | 层叠样式表定义 |
body_attribs | <body>标签属性 |
body | <body>标签内容 |
navbar | 用户定义的导航条 |
content | 用户定义的页面内容 |
scripts | 文档底部的Javascript声明 |
自定义初始程序:
from flask import Flask, render_template
from flask_bootstrap import Bootstrap
app = Flask(__name__)
bootstrap = Bootstrap(app)
@app.route('/')
def index():
return render_template('index.html')
使用模板继承机制自定义的index页面:
{% extends "base.html" %}
{% block title %}Flasky{% endblock %}
{% block page_content %}
<div class="page-header">
<h1>Hello World!</h1>
</div>
{% endblock %}
自定义404处理程序
@app.errorhandler(404)
def page_not_found(e):
return render_template('404.html'), 404
使用模板继承机制自定义的404页面:
{% extends "base.html" %}
{% block title %}Flasky - Page Not Found{% endblock %}
{% block page_content %}
<div class="page-header">
<h1>Not Found</h1>
</div>
{% endblock %}
自定义/user/<name>处理程序:
@app.route('/user/<name>')
def user(name):
return render_template('user.html', name=name)
使用模板继承机制自定义的user页面:
{% extends "base.html" %}
{% block title %}Flasky{% endblock %}
{% block page_content %}
<div class="page-header">
<h1>Hello, {{ name }}!</h1>
</div>
{% endblock %}
以视图函数名作为参数,返回对应的URL
url_for('index, _external=True')
返回绝对路径
连接程序内不同路由的链接时,使用相对地址url_for('index')
就足够了
生成动态地址url_for('user',name='john',_external=True)
返回http://localhost:5000/user/john
参数不局限于动态路由中的参数,url_for('index', page=2)
返回结果 /?page=2
默认设置下,Flask在程序根目录中名为static的文件夹中寻找静态文件。可在static中使用子文件夹存放文件
{% block head %}
{{ super() }}
<link rel="shortcut icon" href="{{ url_for('static', filename='favicon.ico') }}" type="image/x-icon">
<link rel="icon" href="{{ url_for('static', filename='favicon.ico') }}" type="image/x-icon">
{% endblock %}
安装基于moment.js的拓展程序:pip install flask-moment
Flask-Moment实现了moment.js中的format()、fromNow()、fromTime()、calendar()、valueOf()、unix()方法
base.html 引入:
{% block scripts %}
{{ super() }}
{{ moment.include_moment() }}
{% endblock %}
hello.py 引入:
from datetime import datetime
from flask import Flask, render_template
from flask_bootstrap import Bootstrap
from flask_moment import Moment
app = Flask(__name__)
bootstrap = Bootstrap(app)
moment = Moment(app)
@app.route('/')
def index():
return render_template('index.html',
current_time=datetime.utcnow())
index.html 渲染:
format('LLL')
根据客户端电脑的时区和区域设置渲染日期和时间;L到LLL分别对应不同的复杂度fromNow()
渲染相对时间戳,随时间的推移自动刷新显示的时间:2 minutes ago
<p>The local date and time is {{ moment(current_time).format('LLL') }}.</p>
<p>That was {{ moment(current_time).fromNow(refresh=True) }}.</p>
{{ moment.lang('es') }}
标签:引擎 jinjia 集中 and end favicon vba nal 显示
原文地址:https://www.cnblogs.com/localhost-ha/p/12450807.html