一. 修改|-app/models.py
Web程序的所有用户的文章存储在数据库里, 每一篇文章就是数据库中的一条记录, 包括文章主体,发布时间, 作者的id等属性。
class Post(db.Model): __tablename = 'posts' id = db.Column(db.Integer, primary_key=True) body = db.Column(db.Text) timestamp = db.Column(db.Datatime, default=datatime.utcnow) author_id = db.Column(db.Integer, db.ForeignKey('users.id'))
二.修改|-app/-main/forms.py
既然是添加提交文章的功能,那我们得设计一个简单的编辑文章的表单。
class PostForm(FlaskForm): body = TextAreaField("what's on your mind?", validators=[ DataRequired() ]) submit = SubmitField("Submit")
该表单只有两个字段, 一个是文本框, 另一个是提交按钮。
三. 修改|-app/-main/views.py
有了表单和数据表, 我们就需要路由函数来显示表单和数据表中的内容, 并且处理表单中提交的文章。
@main.route('/', methods=['GET', 'POST']) def index(): form = PostForm() if current_user.can(Permission.WRITE_ARTICLES) and \ form.validate_on_submit(): post = Post(body=form.body.data, author=current_user._get_current_object()) db.session.add(post) return redirect(url_for('.index')) posts = Post.query.order_by(Post.timestamp.desc()).all() return render_template('index.html', form=form, posts=posts)
四. 修改|-app/templates/index.html
{% extends 'base.html' %} {% block title %}Falsky{% endblock %} {% block page_content %} <div class="page-header"> <h1>Hello, {% if current_user.is_authenticated() %}{{ current_user.username }}{% else %}Stanger{% endif %}!</h1> </div> {% if current_user.can(Permission.WRITE_ARTICLES) %} {{wtf.quick_form(form)}} {% endif %} <ul class="posts"> {% for post in {{posts}} %} <li class="post"> <div class="post-thumbnail"> <a href="{{ url_for('main.user', username=post.author.username) }}"><img class="thumbnail" src="{{ post.author.gravatar() }}"></a> </div> <div class="post-date">{{ moment(post.timestamp).formNow() }}</div> <div class="post-author"><a href="{{ url_for('main.user', username=post.author.username) }}">{{ post.author.username }}</a></div> <div class="post-body">{{ post.body }}</div> </li> {% endfor %} </ul> {% endblock %}
三四两部分结合来看, 未登录用户访问主页时, 只会显示欢迎语和所有的文章构成的无序列表,有编辑文章权限的用户登录以后, 还会显示编辑文章的表单, 用户输入文章点击提交按钮, 会提交一条post记录, 然后重定向到主页, 显示所有的文章。
五. 在资料页显示文章列表
当我们访问用户资料页user.html时, 也要显示用户撰写的文章, 只要把指定用户的文章传到user.html模板中即可。
1. 修改|-app/-main/views.py
@main.route('/user/<username>') def user(username): user = User.query.filter_by(username=username).first() if not user: abort(404) posts = user.posts.order_by(Post.timestamp.desc()).all() return render_template('user.html', user=user, posts=posts)
2.修改|-app/templates/user.html
只需要把index.html中那段显示文章的无序列表搬过来即可, 但是代码重复会显得冗余, 于是我们把无序列表单独放在_posts.html里面, 然后用include包含进user.html
<h3>Posts by {{ user.username }}</h3> {% include "_posts.html" %}
六. 效果演示
1.未登录用户访问主页2.登陆以后重定向到主页
3.点击文章的提交按钮
4.点击profile链接, 进入自己的资料页