uniapp实现分页

HBuilder先安装分页插件

<template>
	<view>

			<view v-for="(value, index) in currentList" :key="index">

			<view class="uni-media-list-text-top">{{ value }}</view>
				</view>
	
	
			
				
			<uni-pagination :total="totalConsumableList.length" :current="current" @change="handleChange"   />
	</view>
</template>
<script>
	
	import uniPagination from "../../uni_modules/uni-pagination/components/uni-pagination/uni-pagination.vue"
	
	export default {
		onLaunch: function() {
			console.log('App Launch')
		},
		onShow: function() {
			console.log('App Show')
			 this.startReadRFID();
		},
		onHide: function() {
			console.log('App Hide')
		},
		data() {
			return {
				tagCodeListLength:0,
				tagCodeList:[],
				totalConsumableList:[],
				// currentList:[],
				// totalPages:0,
				current:1,
				pageSzie:10,

				status: 'more',
				
				
			};
		},

		onLoad(options){
			// console.log(listData(options).outOrder)
			 muVikilyControl.init(res => {})
		},
		onPullDownRefresh() {
			this.reload = true;
			this.last_id = '';
			// this.getBanner();
			// this.getList();
		},
		onReachBottom() {
			this.status = 'more';
			// this.getList();
		},
		computed: {
		    currentList() {
		      const startIndex = (this.current - 1) * this.pageSzie;
		      const endIndex = startIndex + this.pageSzie;
		      return this.totalConsumableList.slice(startIndex, endIndex);
		    },
		    totalPages() {
		      return Math.ceil(this.totalConsumableList.length / this.pageSzie);
		    }
		  },
		
			
		}
	};
</script>