forest-map-back/src/components/Pagination.vue

<template>
	<div>
		<el-pagination
		  v-if="show"
		  background
		  :page-size.sync="pageSize"
		  :pager-count="11"
		  layout="prev,pager,next,total"
		  @current-change="onChange"
		  :total="count">
		</el-pagination>
	</div>
	
</template>

<script>
	import {paginationConfig} from '@/api/CONST'
	export default{
		 name: 'Pagination',
		 props:{
			 total: {
			   type: [String, Number],
			   default:0
			 }
		 },
		 data(){
			return{
				show:true,
				pageSize: paginationConfig.pageSize,
				count: 0
			} 
		 },
		 created(){
		 },
		 methods:{
			 onChange(index){
				 const json = {
					 pageNo: index,
					 pageSize: paginationConfig.pageSize
				 }
				 this.$emit('change',json)
			 }
		 },
		 watch:{
			 total(newVal,oldVal){
				this.show = false
				this.count = newVal
				const timer = setTimeout(()=>{
					this.show = true
					clearTimeout(timer)
				},10)
			 }
		 }
	}
</script>

<style>
</style>