Vue —— 分页器_uview分页

• 全局组件：分页器 Pagination

<template>
    <div class="pagination">
        <button :disabled="pageNo==1" @click="$emit('getPageNo',pageNo-1)">上一页</button>
        <button v-if="startNumAndEndNum.start > 1" @click="$emit('getPageNo',1)" :class="{active:pageNo==1}">1</button>
        <button v-if="startNumAndEndNum.start > 2">···</button> 

        <!-- 中间部分 -->
        <button v-for="(page,index) in startNumAndEndNum.end" :key="index" v-if="page >= startNumAndEndNum.start"  @click="$emit('getPageNo',page)" :class="{active:pageNo==page}">{
   {
   page}}</button>


        <button v-if="startNumAndEndNum.end  < totalPage -1">···</button>
        <button v-if="startNumAndEndNum.end < totalPage" @click="$emit('getPageNo',totalPage)" :class="{active:pageNo==total}">{
   {
   totalPage}}</button>
        <button 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16