使用vue js和fractal限制分页中的页码

时间:2017-08-09 09:26:52

标签: vuejs2

使用vue js和fractal进行分页,从json结果得到超过500页, 我如何一次显示5个页面,而不是同时显示所有500个页面。

我的代码如下所示,它显示所有页面而不是分批打破它们。

<ul class="pagination pagination-split">
<li class="paginate_button" v-bind:class="{'disabled': !pagination.links.previous }">
    <a class="page-link" href="#" aria-label="Previous" @click.prevent="switchPage(pagination.current_page - 1)">
        <span aria-hidden="true">&laquo;</span>
        <span class="sr-only">Previous</span>
    </a>
</li>

<li class="paginate_button" v-for="page in pagination.total_pages" v-bind:class="{'active':pagination.current_page === page }">
    <a class="page-link" href="#" @click.prevent="switchPage(page)">{{page}}</a>
</li>

<li class="paginate_button" v-if="pagination.links.next" v-bind:class="{'disabled': !pagination.links.next }">
    <a class="page-link" href="#" aria-label="Next" @click.prevent="switchPage(pagination.current_page + 1)">
        <span aria-hidden="true">&raquo;</span>
        <span class="sr-only">Next</span>
    </a>
</li>

0 个答案:

没有答案