Question

我是python的新手，我正在尝试使用Flask框架创建一个网站。

我使用Flask-FlatPages扩展名来渲染特定目录中的markdown文件，我想分页。为了防止长页面和无限滚动，我想剪切页面并在多个页面上呈现每个页面。我认为一种简单的方法可以是切割html标签，例如<h2>。

我不确定我是否足够清楚，主要观点是一篇多篇文章或一系列文章。

我只找到了有关使用数据库和分页查询结果的答案。

我不知道这是应该在python / flask中还是在jinja模板中完成。

编辑：正如我在这里的评论中提到的，我使用它来呈现我的.md文件：

pages = FlatPages(app)

@app.route('/')
def index():
    # Articles are pages with a publication date
    articles = (p for p in pages if 'published' in p.meta)
    # Show the 10 most recent articles, most recent first.
    latest = sorted(articles, reverse=True,
                    key=lambda p: p.meta['published'])
    return render_template('articles.html', articles=latest[:10])

@app.route('/<path:path>/')
def page(path):
    page = pages.get_or_404(path)
    template = page.meta.get('template', 'flatpage.html')
    return render_template(template, page=page)

我认为我需要修改此路线（或平面模板），以分页page。

Answer 1

最简单的方法是在the table of contents extension中启用FLATPAGES_MARKDOWN_EXTENSIONS（或者，您可以启用header IDs或attribute lists并自行维护TOC。）：< / p>

FLATPAGES_MARKDOWN_EXTENSIONS = ['markdown.extensions.toc']

然后你可以使用一些CSS来设置所选元素的样式：

h2, p {
  display: none;
}
/* At some future time
   you'll be able to hide the summary
   using the :has pseudo selector.
   For now you'll have to use some JavaScript
   to listen to click events on the TOC. */
h1:has(~ h2:target), h1:has(~ h2:target) + p {
  display: none;
}

h1, h1:target + p,
h2:target, h2:target + p {
  display: block;
}

/* TOC styling - not relevant to whole */
ul {
  border: 1px solid gray;
  list-style-type: none;
  margin: 0;
  padding: 1em .25em;
}
li {
  display: inline-block;
  margin: 0;
  padding: 0;
}
li::before {
  color: #777;
  content: ":";
  display: inline-block;
  margin: 0 .5em;
}
li:first-child {
  margin-left: 0;
}
li:first-child::before {
  content: none;
}

<ul>
  <li><a href="#summary">summary</a>
  </li>
  <li><a href="#first-section">1</a>
  </li>
  <li><a href="#second-section">2</a>
  </li>
</ul>

<h1 id="summary">This is my article</h1>
<p>Some introductory content
  <br>With some lines
  <br>in it</p>
<h2 id="first-section">First section</h2>
<p>The most interesting thing about this content? It exists.</p>
<h2 id="second-section">Second section</h2>
<p>More content, content, content, content, content.</p>

Answer 2

这就是我的工作。首先，您需要限制数据库请求，这样如果您的结果是2,000条记录，您只想查看前50条记录，您可以在查询结束时执行此类操作....

"order by TableName.SomeID limit " + str(int(CurrentPage) * 50 - 50) + ", 50;"

以下是有关限制和偏移量的更多信息：http://www.mysqltutorial.org/mysql-limit.aspx

无论如何使用CurrentPage来获取你的偏移量，以便在第1页上限制看起来像这个限制0,50 - 意味着给我50行并从第0行开始。在第2页，限制看起来像这个限制50， 50 - 意思是给我50行并从第50行开始。此外，你需要在那里保留一个order by子句，以便在分页时保持一致的结果。

您还需要在没有限制的情况下运行另一个查询，以便您知道总共有多少页。只有选择count（*）才能逃脱此查询。以下是我从该查询计算总页数的方法......

    # 50 for the number of results per page
    TotalPages = (ResultsCount[0]['Count(*)'] // 50)  
    # find out if there is a remainder of results if so add one more page
    if((ResultsCount[0]['Count(*)'] % 50) > 0):
        TotalPages +=1

现在你的jinja2应该是这样的......

{% if TotalPages > 1 and CurrentPage < 15 %}
{% for Item in range(TotalPages) %}
{% if loop.index == CurrentPage %}
        <div style="border: 1px solid; border-color: #1C5F8B; width: 22px; height: 16px; text-align: center; float: left; margin: 2px; padding-top: 2px"><b>{{ loop.index }}</b></div>
    {% elif loop.index < 15 %}
        <a style="cursor: pointer; color: #000000" href="/class/getdata?CurrentPage={{ loop.index }}"><div style="border: 1px solid; width: 22px; height: 16px; text-align: center; float: left; margin: 2px; padding-top: 2px">{{ loop.index }}</div></a>
    {% elif loop.index == 15 %}
        <a style="cursor: pointer; color: #000000" href="/class/getdata?CurrentPage={{ loop.index }}"><div style="border: 1px solid; width: 28px; height: 16px; text-align: center; float: left; margin: 2px; padding-top: 2px">Next</div></a>
    {% endif %} 
{% endfor %}
{% elif TotalPages > 1 and (CurrentPage + 15) < TotalPages %}
    {% for Item in range(15 * CurrentPage) %}
        {% if loop.index0 == (CurrentPage - 15) %}
            <a style="cursor: pointer; color: #000000" href="/class/getdata?CurrentPage={{ loop.index }}"><div style="border: 1px solid; width: 28px; height: 16px; text-align: center; float: left; margin: 2px; padding-top: 2px">Prev</div></a>
        {% elif loop.index == CurrentPage %}
            <div style="border: 1px solid; border-color: #1C5F8B; width: 22px; height: 16px; text-align: center; float: left; margin: 2px; padding-top: 2px"><b>{{ loop.index }}</b></div>
        {% elif loop.index > CurrentPage and loop.index < (CurrentPage + 15) and loop.index < TotalPages %}
            <a style="cursor: pointer; color: #000000" href="/class/getdata?CurrentPage={{ loop.index }}"><div style="border: 1px solid; width: 22px; height: 16px; text-align: center; float: left; margin: 2px; padding-top: 2px">{{ loop.index }}</div></a>
        {% elif loop.index == (CurrentPage + 15) and loop.index < TotalPages %}
            <a style="cursor: pointer; color: #000000" href="/class/getdata?CurrentPage={{ loop.index }}"><div style="border: 1px solid; width: 28px; height: 16px; text-align: center; float: left; margin: 2px; padding-top: 2px">Next</div></a>
        {% elif loop.index == TotalPages and (CurrentPage + 15) > TotalPages %}
            <a style="cursor: pointer; color: #000000" href="/class/getdata?CurrentPage={{ loop.index }}"><div style="border: 1px solid; width: 22px; height: 16px; text-align: center; float: left; margin: 2px; padding-top: 2px">{{ loop.index }}</div></a>
        {% endif %} 
    {% endfor %}
    {% elif TotalPages > 1 %}
        {% for Item in range(15 * CurrentPage) %}
            {% if (loop.index - 1) == (CurrentPage - 15) %}
                <a style="cursor: pointer; color: #000000" href="/class/getdata?CurrentPage={{ loop.index }}"><div style="border: 1px solid; width: 28px; height: 16px; text-align: center; float: left; margin: 2px; padding-top: 2px">Prev</div></a>
            {% elif loop.index == CurrentPage %}
                <div style="border: 1px solid; border-color: #1C5F8B; width: 22px; height: 16px; text-align: center; float: left; margin: 2px; padding-top: 2px"><b>{{ loop.index }}</b></div>
            {% elif loop.index > (TotalPages - 15) and loop.index < (CurrentPage + 15) and loop.index < TotalPages %}
                <a style="cursor: pointer; color: #000000" href="/class/getdata?CurrentPage={{ loop.index }}"><div style="border: 1px solid; width: 22px; height: 16px; text-align: center; float: left; margin: 2px; padding-top: 2px">{{ loop.index }}</div></a>
            {% elif loop.index == TotalPages and (CurrentPage + 15) > TotalPages %}
                <a style="cursor: pointer; color: #000000" href="/class/getdata?CurrentPage={{ loop.index }}"><div style="border: 1px solid; width: 22px; height: 16px; text-align: center; float: left; margin: 2px; padding-top: 2px">{{ loop.index }}</div></a>
            {% endif %} 
        {% endfor %}
    {% endif %}

希望这有帮助！

在烧瓶烧瓶中分页长页

2 个答案: