Flask 使用烧瓶分页0.4.5在一页上进行多次分页

Flask 使用烧瓶分页0.4.5在一页上进行多次分页,flask,pagination,flask-sqlalchemy,multiple-instances,paginate,Flask,Pagination,Flask Sqlalchemy,Multiple Instances,Paginate,我想使用flask paginate在一个页面上呈现三个分页。 问题是三个分页是同步的,即单击一个分页的“下一页”也会影响另一个分页。 我尝试使用不同的页面名称进行不同的分页,但仍然缺少一些内容。 我还没有找到关于多重分页的任何信息,请帮助我解决这个问题。 请看附件中的图片以便更好地理解。 请注意,在创建此应用程序时,我遵循了Miguel Gringberg的书,但他只考虑单页而不是多页 我有一个discover.html页面,其中包含3个分页元素列表: <div class="disco

我想使用flask paginate在一个页面上呈现三个分页。 问题是三个分页是同步的,即单击一个分页的“下一页”也会影响另一个分页。 我尝试使用不同的页面名称进行不同的分页,但仍然缺少一些内容。 我还没有找到关于多重分页的任何信息,请帮助我解决这个问题。 请看附件中的图片以便更好地理解。 请注意,在创建此应用程序时,我遵循了Miguel Gringberg的书,但他只考虑单页而不是多页

我有一个discover.html页面,其中包含3个分页元素列表:

<div class="discover-content">

        <div class="contests-list">
            {% with projects=contests, pagination=contests_pagination, page='main.discover', fragment='#contests' %}
                <h2>Most Recent Contests</h2>
                {% include '_contests.html' %}
            {% endwith %}
        </div>

        <div class="skills-list">
            {% with skills=skills, pagination=skills_pagination, page='main.discover', fragment='#skills' %}
                <h2>Skills</h2>
                {% include '_skills.html' %}
            {% endwith %}
        </div>

        <div class="ideas-list">
            {% with projects=ideas, pagination=ideas_pagination, page='main.discover', fragment='#ideas' %}
                <h2>Most Recent Ideas</h2>
                {% include '_ideas.html' %}
            {% endwith %}
        </div>

</div>
其中每个列表类似于以下_skills.html:

{% import "_macros.html" as macros %}

<ul class="skills">
    {% for skill in skills %}
        {% if skill.name %}
        <li class="skill">{{ skill.name }}</li>
        {% endif %}
    {% endfor %}
</ul>

{% if pagination %}
    <div class="pagination">
        {{ macros.pagination_widget(pagination, page, fragment=fragment) }}
    </div>
{% endif %}
文件_macros.html的工作方式如下:

{% macro pagination_widget(pagination, endpoint, fragment='') %}
<ul class="pagination">
    <li{% if not pagination.has_prev %} class="disabled"{% endif %}>
        <a href="{% if pagination.has_prev %}{{ url_for(endpoint, page=pagination.prev_num, **kwargs) }}{{ fragment }}{% else %}#{% endif %}">
            &laquo;
        </a>
    </li>
    {% for p in pagination.iter_pages() %}
        {% if p %}
            {% if p == pagination.page %}
            <li class="active">
                <a href="{{ url_for(endpoint, page = p, **kwargs) }}{{ fragment }}">{{ p }}</a>
            </li>
            {% else %}
            <li>
                <a href="{{ url_for(endpoint, page = p, **kwargs) }}{{ fragment }}">{{ p }}</a>
            </li>
            {% endif %}
        {% else %}
        <li class="disabled"><a href="#">&hellip;</a></li>
        {% endif %}
    {% endfor %}
    <li{% if not pagination.has_next %} class="disabled"{% endif %}>
        <a href="{% if pagination.has_next %}{{ url_for(endpoint, page=pagination.next_num, **kwargs) }}{{ fragment }}{% else %}#{% endif %}">
            &raquo;
        </a>
    </li>
</ul>
{% endmacro %}
与discover.html页面关联的视图如下所示:

@main.route('/discover', defaults={'page_c': 1, 'page_i': 1, 'page_s': 1}, methods=['GET', 'POST'])
@main.route('/discover/page_c/<int:page_c>/page_i/<int:page_i>/page_s/<int:page_s>', methods=['GET', 'POST'])
def discover(page_c, page_i, page_s):

    contests_page = request.args.get(page_c, 1, type=int)
    contests_pagination = Project.query.filter_by(project_type='contest').order_by(Project.timestamp.desc()).paginate(
        contests_page, per_page=current_app.config['CONTESTS_PER_PAGE'], error_out=False)
    contests = contests_pagination.items

    ideas_page = request.args.get(page_i, 1, type=int)
    ideas_pagination = Project.query.filter_by(project_type='idea').order_by(Project.timestamp.desc()).paginate(
        ideas_page, per_page=current_app.config['IDEAS_PER_PAGE'], error_out=False)
    ideas = ideas_pagination.items

    skills_page = request.args.get(page_s, 1, type=int)
    skills_pagination = Skill.query.order_by(Skill.name.desc()).paginate(
        skills_page, per_page=current_app.config['SKILLS_PER_PAGE'], error_out=False)
    skills = skills_pagination.items


    return render_template('discover.html', contests=contests, ideas=ideas, skills=skills,
                           contests_pagination=contests_pagination, ideas_pagination=ideas_pagination,
                           skills_pagination=skills_pagination)

处理这一问题最清晰的方法是使用异步Ajax请求。您的三个项目列表将有三个单独的端点,每个端点分别分页。主HTML页面将向这三个端点发出Ajax请求,在一个列表中的页面之间移动不会影响其他两个列表

如果您想继续将其作为包含三个列表的单个页面进行,那么您必须确保所有列表中的分页链接包含所有三个列表的正确页码。例如,如果您分别在这三个列表中查看第1、2和3页,并且在第二个列表中点击下一页,则下一页链接应该指向/discover/page_c/1/page_i/3/page_s/3,以便第一个和第三个列表保留在第1和第3页上,第二个列表从第2页移动到第3页。您需要在宏中增加更多的复杂性,它需要知道三个列表的页码,以及哪些列表正在更改