vlambda博客
学习文章列表

flask实例改编(四)模板优化&网址智能对接

一个demo中,不同网页往往会使用相同的变量,这让每一个视图函数都要重复传入这个变量;不同的网页往往存在大量相同的代码。


显而易见,对于这两种情况,我们拥有更靠谱的解决办法。


一、我们可以使用模板上下文处理函数解决不同视图重复传入变量的问题。

@app.context_processor #函数名可以随意修改def inject_user(): user = User.query.first() return dict(user=user) # 需要返回字典,等同于return{'user':user}

二、使用继承来组织模板(详见:完整代码base.html)


三、与东方财富网智能对接(通过对东方财富网网址进行观察,找出keyword,再用变量替代网址中keyword的内容,使demo的超链接实现与东方财富网智能对接功能)

<span class="float-right"> <a class="dfcf" href="https://so.eastmoney.com/web/s?keyword={{company.title}}" target="blank" title="访问东方财富网获取{{ company.title }}信息">东方财富网</a></span>


四、完整代码如下:


app.py

import osimport sysimport clickfrom flask import Flask, render_templatefrom flask_sqlalchemy import SQLAlchemy
WIN = sys.platform.startswith('win')if WIN: #如果是windows系统,使用三个斜线 prefix = 'sqlite:///'else: #否则使用四个斜线 prefix = 'sqlite:////'
app = Flask(__name__)app.config['SQLALCHEMY_DATABASE_URI'] = prefix + os.path.join( app.root_path, 'data.db')app.config['SQALCHEMY_TRACK_MODIFICATIONS'] = False # 关闭对模型修改的监控# 在扩展类实例化前加载配置
db = SQLAlchemy(app)
@app.cli.command() #注册为命令@click.option('--drop', is_flag=True, help='Greate after drop.')# 设置选项def initdb(drop): """初始化数据库Initialize the database.""" if drop: #判断是否输入了选项 db.drop_all() db.create_all() click.echo('Initialized database.') #输出提示信息
@app.cli.command()def forge(): """生成虚拟数据Generate fake data.""" db.create_all # 全局的两个变量移动到这个函数内 name = '琢磨' companys = [ {'title': '中顺洁柔', 'code': '002511'}, {'title': '绿伞化学', 'code': '430666'}, {'title': '茶花股份', 'code': '603615'}, {'title': '天际股份', 'code': '002759'}, {'title': '上海家化', 'code': '600315'}, {'title': '晨光文具', 'code': '603899'}, {'title': '恒通股份', 'code': '603223'}, {'title': '安车检测', 'code': '300572'}, {'title': '多伦科技', 'code': '603528'}, {'title': '南华仪器', 'code': '300417'}, {'title': '秦川物联', 'code': '688528'}, {'title': '紫晶存储', 'code': '688086'}, {'title': '一心堂', 'code': '002727'}, ] user = User(name=name) db.session.add(user) for i in companys: company = Company(title=i['title'], code=i['code']) db.session.add(company)
db.session.commit() click.echo('Done')
class User(db.Model): id = db.Column(db.Integer, primary_key=True) #主键 name = db.Column(db.String(20)) #名字
class Company(db.Model): #表名将会是company id = db.Column(db.Integer, primary_key=True) #主键 title = db.Column(db.String(60)) #上市公司名称 code = db.Column(db.String(6)) #股票代码
@app.context_processor #函数名可以随意修改def inject_user(): user = User.query.first() return dict(user=user) # 需要返回字典,等同于return{'user':user}
@app.errorhandler(404) # 传入要处理的错误代码def page_not_found(e): # 接受异常对象做为参数 return render_template('404.html'), 404 # 返回模板和状态码
@app.route('/')def index(): companys = Company.query.all() #读取所有上市公司记录  return render_template('index.html', companys=companys)


base.html

<!DOCTYPE html><html lang='en'><head> {% block head %} <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>{{ user.name }}关注的上市公司清单</title> <link rel="icon" href="{{ url_for('static', filename='zm.gif')}}"> <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='style.css')}}"> {% endblock %}</head><body> <h2> <img alt="Zmtx" class="zmtx" src="{{ url_for('static', filename='images/zmtx.gif')}}"> {{ user.name }}关注的上市公司清单 </h2> <nav> <ul> <li><a href="{{ url_for('index') }}">返回</a></li> </ul> </nav> {% block content %}{% endblock %} <footer> <small>&copy; 2018 <a href="http://helloflask.com/tutorial">HelloFlask</a></small> </footer></body></html>


index.html

{% extends 'base.html' %}
{% block content %}<p>目前清单上共有:{{ companys|length }}家上市公司</p><ul class="company-list"> {% for company in companys %} <li>{{ company.title }} - {{ company.code }} <span class="float-right"> <a class="dfcf" href="https://so.eastmoney.com/web/s?keyword={{company.title}}" target="blank" title="访问东方财富网获取{{ company.title }}信息">东方财富网</a> </span> </li> {% endfor %}</ul><img alt="Mgt" class="mgt" src="{{ url_for('static', filename='images/mgt.gif') }}" title="mgt">{% endblock %}


404.html

{% extends 'base.html' %}
{% block content %}<ul class="company-list"> <li> Page Not Found - 404 <span class="float-right"> <a href="{{ url_for('index') }}">返回</a> </span> </li></ul>{% endblock %}


style.css

/*页面整体*/body{ margin: auto; max-width: 580px; font-size: 14px; font-family: Helvetica, Arial, sans-serif;}
/*导航栏*/nav ul{ list-style-type: none; margin: 0; padding: 0; overflow: hidden; background-color: #ff9900;}
nav li{ float: left;}
nav li a{ display: block; color: white; text-align: center; padding: 8px 12px; text-decoration: none;}
nav li a:hover{ background-color: #111;}
/*页脚*/footer{ color: #888; margin-top: 15px; text-align: center; padding: 10px;}
/*头像*/.zmtx{ width: 40px;}
/*上市公司列表*/.company-list{ list-style-type: none; padding: 0; margin-bottom: 10px; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 1.16), 0 2px 10px 0 rgba( 0,0,0,0.12);}
.company-list li{ padding: 12px 24px; border-bottom: 1px solid #ddd;}
.company-list li:last-child{ border-bottom: none;}
.company-list li:hover{ background-color: #f8f9fa;}/*东方财富链接*/.float-right{ float: right;}
.dfcf{ font-size: 12px; font-weight: bold; color: #ffffff; text-decoration: none; background: #ff9900; border-radius: 5px; padding: 3px 5px;}/*蘑菇头动图*/.mgt{ display: block; margin: 0 auto; height: 100px;}


五、效果图如下:


index


404