如何通过标签对Flask中的博客文章进行分类

时间:2019-09-07 04:37:04

标签: javascript python html flask categories

我创建了一个带有Post Model的基本博客,其中有一个“ tags”列。我目前将此标签用作放置“ python”或“ insert_what_my_blog_post_is_about_here”的标签。

我很难弄清楚如何将所有这些帖子分类显示。因此,例如,当针对该特定类别单击(侧栏或按钮)时,每个带有标签“ python”的博客帖子都将显示在页面上。

我尝试创建另一个名为“ topics.html”的页面,并进行路由以吸收博客文章的内容并将其显示在例如“ www.mysite.com/topics/python”上。 这使我迷失了代码,因为我对Flask还是很陌生,并且无法在未定义的情况下获取正确的“标签”。

我也尝试过使用JavaScript对内容块进行隐藏和显示。 这导致UI上的按钮难看,仅在我想要所有选项的帖子中切换了隐藏/显示。此外,隐藏/显示是基于按钮的单击,而不是基于我希望在博客文章中匹配的情况下要显示的标签。

我还没有尝试过最后一个解决方案,但是更多的是一个想法。我正在查看位于“ https://jinja.palletsproject.com/en/2.10.x/templates/#builtin-filters”的一些Jinja文档中的过滤器。 感兴趣的过滤器是groupby,map,select,selectattr,但是我不知道如何或在我的代码中实现它们。

所有这些都在posts目录中,除了models.py:

models.py [我的帖子数据库模型]

lass Post(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    title = db.Column(db.String(100), nullable=False)
    date_posted = db.Column(db.DateTime, nullable=False, default=datetime.utcnow)
    tags = db.Column(db.String(50), nullable=False)
    content = db.Column(db.Text, nullable=False)
    resourcesOne = db.Column(db.String(150), nullable=True)
    resourcesTwo = db.Column(db.String(150), nullable=True)
    resourcesThree = db.Column(db.String(150), nullable=True)

    def __repr__(self):
        return f"Post('{self.title}', '{self.date_posted}')"

posts / forms.py [我在www.mywebsite.com/blog/new上创建新帖子的表单]

class PostForm(FlaskForm):
    title = StringField('Title', validators=[DataRequired()])
    content = TextAreaField('Content', validators=[DataRequired()])
    tags = StringField('Tags', validators=[DataRequired()])
    resourcesOne = StringField('Resources', validators=[DataRequired()])
    resourcesTwo = StringField('Resources', validators=[DataRequired()])
    resourcesThree = StringField('Resources', validators=[DataRequired()])
    submit = SubmitField('Post')

posts / routes.py [提交表单后呈现模板的我的路径]

osts = Blueprint('posts', __name__)


@posts.route("/blog/new", methods=['GET', 'POST'])
@basic_auth.required
def new_post():
    form = PostForm()
    if form.validate_on_submit():
        post = Post(title=form.title.data, tags=form.tags.data,
                    content=form.content.data, resourcesOne=form.resourcesOne.data,
                    resourcesTwo=form.resourcesTwo.data, resourcesThree=form.resourcesThree.data)
        db.session.add(post)
        db.session.commit()
        flash('Your post has been created!', 'success')
        return redirect(url_for('main.blog'))
    return render_template('create_post.html', title='New Post', form=form)

posts / create_post.html [/ blog / new上的create_post.html页面,允许我即时创建帖子]


{% extends "layout.html" %}
{% block post %}
<div class="content-section text-light">
    <form method="POST" action="">
        {{ form.hidden_tag() }}
        <fieldset class="form-group">
            <legend class="border-bottom mb-4">New Post</legend>
            <div class="form-group">
                {{ form.title.label(class="form-control-label") }}
                {% if form.title.errors %}
                    {{ form.title(class="form-control form-control-lg is-invalid") }}
                    <div class="invalid-feedback">
                        {% for error in form.title.errors %}
                            <span>{{ error }}</span>
                        {% endfor %}
                    </div>
                {% else %}
                    {{ form.title(class="form-control form-control-lg") }}
                {% endif %}
            </div>
            <div class="form-group">
                {{ form.tags.label(class="form-control-label") }}
                {% if form.tags.errors %}
                    {{ form.tags(class="form-control form-control-lg is-invalid") }}
                    <div class="invalid-feedback">
                        {% for error in form.tags.errors %}
                            <span>{{ error }}</span>
                        {% endfor %}
                    </div>
                {% else %}
                    {{ form.tags(class="form-control form-control-lg") }}
                {% endif %}
            </div>
            <div class="form-group">
                {{ form.content.label(class="form-control-label") }}
                {% if form.content.errors %}
                    {{ form.content(class="form-control form-control-lg is-invalid") }}
                    <div class="invalid-feedback">
                        {% for error in form.password.errors %}
                            <span>{{ error }}</span>
                        {% endfor %}
                    </div>
                {% else %}
                    {{ form.content(class="form-control form-control-lg") }}
                {% endif %}
            </div>
            <div class="form-group">
                {{ form.resourcesOne.label(class="form-control-label") }}
                {% if form.resourcesOne.errors %}
                    {{ form.resourcesOne(class="form-control form-control-lg is-invalid") }}
                    <div class="invalid-feedback">
                        {% for error in form.password.errors %}
                            <span>{{ error }}</span>
                        {% endfor %}
                    </div>
                {% else %}
                    {{ form.resourcesOne(class="form-control form-control-lg") }}
                {% endif %}
            </div>
            <div class="form-group">
                {{ form.resourcesTwo.label(class="form-control-label") }}
                {% if form.resourcesTwo.errors %}
                    {{ form.resourcesTwo(class="form-control form-control-lg is-invalid") }}
                    <div class="invalid-feedback">
                        {% for error in form.password.errors %}
                            <span>{{ error }}</span>
                        {% endfor %}
                    </div>
                {% else %}
                    {{ form.resourcesTwo(class="form-control form-control-lg") }}
                {% endif %}
            </div>
            <div class="form-group">
                {{ form.resourcesThree.label(class="form-control-label") }}
                {% if form.resourcesThree.errors %}
                    {{ form.resourcesThree(class="form-control form-control-lg is-invalid") }}
                    <div class="invalid-feedback">
                        {% for error in form.password.errors %}
                            <span>{{ error }}</span>
                        {% endfor %}
                    </div>
                {% else %}
                    {{ form.resourcesThree(class="form-control form-control-lg") }}
                {% endif %}
            </div>
        </fieldset>
        <div class="form-group">
            {{ form.submit(class="btn btn-outline-info") }}
        </div>
    </form>
</div>
{% endblock post %}

posts / blog.html [博客的首页及其所有内容]

{% extends "layout.html" %}
{% block content %}
    {% for post in posts.items %}
        <article class="media content-section-main my-secondary ">
          <img class="rounded-circle article-img" src="{{ url_for('static', filename='photos/gallery/meGumWall.jpg') }}">
          <div class="media-body">
            <div class="article-metadata">

              <span class="icon ">
                <i class="fas fa-user"></i>
              </span>
              <a class="mr-2 text-light" href="{{ url_for('main.about') }}">JsonBytes</a>

              <span class="icon ">
                <i class="fas fa-calendar"></i>
              </span>
              <a class="mr-2 text-light">{{ post.date_posted.strftime('%Y-%m-%d') }}</a>

              <span class="icon ">
                <i class="fas fa-tags"></i>
              </span>
              <a class="mr-2 text-light" href='/topics/{{ post.tags }}'>{{ post.tags }}</a>

            </div>
            <h3 class="text-light" href="#">{{ post.title }}</h3>
            <img src="{{ post.image }}" width="100%" height=auto>
            <p class="article-content text-light">{{ post.content }}</p>
            <br><br>
            <h3 class="text-light">Resources:</h3>
            <a class="mr-2 my-secondary" href="{{ post.resourcesOne }}">{{ post.resourcesOne }}</a>
            <br>
            <a class="mr-2 my-secondary" href="{{ post.resourcesTwo }}">{{ post.resourcesTwo }}</a>
            <br>
            <a class="mr-2 my-secondary" href="{{ post.resourcesThree }}">{{ post.resourcesThree }}</a>
          </div>
        </article>

    {% endfor %}
    {% for page_num in posts.iter_pages(left_edge=1, right_edge=1, left_current=1, right_current=2) %}
      {% if page_num %}
        {% if posts.page == page_num %}
          <a class="btn my-btn-info mb-4 my-secondary" href="{{ url_for('main.blog', page=page_num) }}">{{ page_num }}</a>
        {% else %}
          <a class="btn my-btn-info btn-outline-info mb-4 bg-light" href="{{ url_for('main.blog', page=page_num) }}">{{ page_num }}</a>
        {% endif %}
      {% else %}
      <a class="text-white">...</a>
      {% endif %}
    {% endfor %}
{% endblock content %}

预期的结果是,我可以通过单击来在主博客页面上显示不同的标记及其各自的博客文章。...或创建按主题对博客文章进行分类的通往新页面的新路线。 / p>

0 个答案:

没有答案