从零开始学Flask框架-004
Flask-Moment
pip install flask-moment
除了moment.js,Flask-Moment 还依赖jquery.js。但是Bootstrap 已经引入了jquery.js,因此只需引入moment.js 即可。
templates/base.html:引入moment.js 库
{% extends "bootstrap/base.html" %}
{% import "bootstrap/wtf.html" as wtf %}
{% block title %}Flasky{% endblock %}
{#引入moment.js 库#}
{% block scripts %}
{{ super() }}
{{ moment.include_moment() }}
{% 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="/">TEST</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 %}
templates/index.html:
{% extends "base.html" %}
{% block title %}IndexTitle{% endblock %}
<div class="container">
{% block page_content %}
<h1>Hello Flask!</h1>
<p>本地时间格式化:{{ moment(current_time).format('YYYY-MM-DD HH:mm:ss') }}.</p>
<p>本地时间格式化:{{ moment(current_time).format('YYYY-MM-DD') }}.</p>
<p>本地时间格式化:{{ moment(current_time).format('YYYY') }}.</p>
{# {{ wtf.quick_form(form) }}#}
{# 你刚输入的姓名是:#}
{# {{ name }}#}
{% endblock %}
</div>
index.py
from flask import Flask,render_template
from flask_bootstrap import Bootstrap
from flask import request,url_for
from flask_moment import Moment
from datetime import datetime #初始化
app = Flask(__name__)
bootstrap = Bootstrap(app)
# 初始化实例
moment = Moment(app) #路由,处理URL 和函数之间关系的程序称为路由
@app.route('/')
#视图函数,函数执行,返回结果
def index():
return render_template('index.html',current_time=datetime.utcnow()) #启动服务器
if __name__ == '__main__':
app.run()
从零开始学Flask框架-004的更多相关文章
- 从零开始学Flask框架-007
Flash消息 from flask import flash 渲染Flash消息,在基模板base.html中引入get_flashed_messages() {% extends "bo ...
- 从零开始学Flask框架-006
重定向和用户会话 因为刷新页面时浏览器会重新发送之前已经发送过的最后一个请求.如果这个请求是一个包含表单数据的POST 请求,刷新页面后会再次提交表单. 基于这个原因,最好别让Web 程序把POST ...
- 从零开始学Flask框架-005
表单 Flask-WTF 项目结构 pip install flask-wtf 为了实现CSRF 保护,Flask-WTF 需要程序设置一个密钥.Flask-WTF 使用这个密钥生成加密令牌,再用令牌 ...
- 从零开始学Flask框架-003
index.py from flask import Flask,render_template from flask_bootstrap import Bootstrap #初始化 app = Fl ...
- 从零开始学Flask框架-002
Jinja2模板 默认情况下,Flask 在程序文件夹中的templates 子文件夹中寻找模板. Jinja2 中的extends 指令从Flask-Bootstrap 中导入bootstrap/b ...
- 从零开始学Flask框架-001
新建项目 目录结构 Index.html <!DOCTYPE html> <html lang="en"> <head> <meta ch ...
- 从零开始学Flask框架-008
数据库 安装Flask-SQLAlchemy扩展库 pip install flask-sqlalchemy 引入SQLAlchemy类 from flask_sqlalchemy import SQ ...
- 从零开始学 Java - 搭建 Spring MVC 框架
没有什么比一个时代的没落更令人伤感的了 整个社会和人都在追求创新.进步.成长,没有人愿意停步不前,一个个老事物慢慢从我们生活中消失掉真的令人那么伤感么?或者说被取代?我想有些是的,但有些东西其实并不是 ...
- 4. 使用别的json解析框架【从零开始学Spring Boot】
转载:http://blog.csdn.net/linxingliang/article/details/51585921 此文章已经废弃,请看新版的博客的完美解决方案: 78. Spring Boo ...
随机推荐
- 【Vue.js游戏机实战】- Vue.js实现九宫格水果机抽奖游戏总结
大家好!先上图看看本次案例的整体效果. 完整版实战课程附源码:[Vue.js游戏机实战]- Vue.js实现九宫格水果机抽奖 实现思路: Vue component实现九宫格水果机组件,可以嵌套到任意 ...
- 2019UNCTF竞技赛部分writeup
Reverse unctf_babyre2 这题flag分为两部分,第一部分每四个字符一组打包成int后,每次把四个int传入函数,后三个参数异或后先以每位为索引查表,将新数据进行循环移位.异或,将结 ...
- 微信小程序实现左侧滑栏
前言 一直想给项目中的小程序设置侧滑栏,将退出按钮放到侧滑中,但是小程序没有提供相应的控件和API,因此只能自己手动实现,网上很多大神造的轮子很不错,本文就在是站在巨人的肩膀上实现. 效果 先看看效果 ...
- Python自动化测试常用库
基本库: sys 程序和Python解析器的交互 os 启动新进程:操作文件和目录 re 正则表达式,字符串匹配 string 基本字符串操作 inspect 提供自省和反射功能 importlib ...
- mac 修改mysql root密码
01-在系统偏好设置中停止mysql服务 或者使用指令 sudo /usr/local/mysql/support-files/mysql.server stop 02-输入指令: cd /usr/l ...
- vue报错:There are multiple modules with names that only differ in casing.
今天写项目时,遇到报错信息如下: 经过多次排除及参考网上文章,最后找到问题所在 排查原因:1 .在引用组件时,路径大小写不对也会造成此报错,看例子:错误写法: 正确写法: 2.在组件使用vuex时,引 ...
- nginx: [warn] conflicting server name "aaa.bbbb.com" on 0.0.0.0:80, ignored
date: 2019-08-12 16:52:44 author: headsen chen notice :个人原创 故障现象: openresty -t nginx: [warn] confli ...
- 九、postman的自带的鉴权demo
basic authentication https://postman-echo.com/basic-auth username:postman password:password
- osg塔吊模拟-20191026
在osg中模拟塔吊群作业
- MD5Encrypt加密
package utils; import java.security.MessageDigest; public class MD5Encrypt { public MD5Encrypt() { } ...