# index 页面模版

TIP

z-paging

# 基本使用


<template>
	<view class="view-">
		<z-paging ref="paging" v-model="dataList" @query="queryList" :auto-clean-list-when-reload="false"
			:auto-scroll-to-top-when-reload="false" :refresher-status.sync="refresherStatus"
			:auto-show-back-to-top="true" :back-to-top-with-animate="true">

			<template #top>
				<d-navbar title="" :isBack="true"></d-navbar>
			</template>
			
			<view>
				
			</view>

			<template #bottom>
			</template>

		</z-paging>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				dataList: [],
				refresherStatus: null,
				page: 1,
				limit: 10,

			}
		},
		onLoad(options) {
			
		},
		onShow() {
			
		},
		methods: {
			queryList(page, limit) {
				this.page = page
				this.limit = limit

				this.getDataList()
			},
			/**
			 * 初始化
			 */
			initListQuery() {
				this.$refs.paging.reload()
			},
			/**
			 * 获取列表
			 */
			getDataList() {
				let dataList = []
				
				return this.$refs.paging.complete(dataList);
			},
			
			
			
			

		},
	}
</script>

<style lang="scss">
	page {
		background-color: #fff;
	}
</style>


✅ Copy success!