首页列表显示全部问答,完成问答详情页布局。

  1. 首页列表显示全部问答:
    1. 将数据库查询结果传递到前端页面 Question.query.all()
    2. 前端页面循环显示整个列表。
    3. 问答排序
  2. 完成问答详情页布局:
    1. 包含问答的全部信息
    2. 评论区
    3. 以往评论列表显示区。
  3. 在首页点击问答标题,链接到相应详情页。

py:

@app.route('/')
def index():
    context ={
        'questions':Question.query.order_by('-create_time').all()
    }
    return render_template('index.html',**context)

@app.route('/detail/<question_id>')
def detail(question_id):
    quest = Question.query.filter(Question.id == question_id).first()
    return render_template('detail.html',ques=question_id)

index.html:

 <ul class="news-list ">
        {% for foo in questions %}
            <li class="post_item_summary ">
                <a class="titlelnk" target="_self" href="{{ url_for('detail',question_id=foo.id) }}">{{ foo.title }}</a><br>
                <a href="#" class="lightblue">{{ foo.author.username }}</a>
                <br>
                <img width="48" height="48" class="pfs" src="https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=4066191998,32277144&fm=27&gp=0.jpg" alt="">
                <p class="post_item_summary ">
                    {{ foo.detail }}
                </p>
                <span class="post_item_foot">
            发布于   {{ foo.create_time }}
            </span>
            </li>
        <hr>
        {% endfor %}
    </ul>

detail.html:

{% extends'base.html' %}
{% block title %}问答详情 {% endblock %}

{% block head %}
 <link rel="stylesheet" type="text/css" href="{{ url_for('static',filename='css/detail.css') }}">

{% endblock %}

{% block main %}
<div class="post">
<div>
<h3 class="title ">题目  {{ ques}}<br><small>作者  发布时间  </small></h3>
</div>
    <p style="color: #333;">详情  </p>
    <hr>
    <form action="{{ url_for('question') }}"method="post">
    <div class="new-comment">
        <textarea name="new_comment" id="new-comment" cols="85" rows="5" placeholder="评论..."></textarea>
    </div>
    <button class="btn-send" type="submit">发送</button>
    </form>
   <ul class="list"style="margin:10px">
       <li class="post_item">
           <a href="#" class="light">jjjjjj</a>
           <br>
           <img width="48" height="48" class="pf" src="https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=4066191998,32277144&fm=27&gp=0.jpg" alt="">
           <p class="post_item">棒棒棒,你最棒!</p>
           <span class="foot">发布于  jjjjj </span>
       </li>
       <hr>

   </ul>
</div>
{% endblock %}

posted @ 2017-12-01 16:43  041覃楚君  阅读(128)  评论(0)    收藏  举报