<template>
	<view class="k-scroll-load">
		<swiper class="swiper" vertical>
			<swiper-item class="swiper-item">
				<scroll-view
					class="k-scroll-view"
					scroll-y
					lower-threshold="20"
					scroll-with-animation
					@scrolltoupper="scrolltoupper"
					@scrolltolower="scrolltolower"
				>
					<slot></slot>
				</scroll-view>
			</swiper-item>
		</swiper>
	</view>
</template>

<script>
	export default {
		name: 'k-scroll-load',
		data() {
			return {
				
			}
		},
		methods: {
			scrolltoupper(e) { // 顶部，左侧触顶事件
				console.log("====顶部，左侧触顶事件", e)
			},
			scrolltolower(e) { // 底部，右侧侧触底事件
				console.log("====底部，右侧侧触底事件==", e)
			}
		}
	}
</script>

<style scoped lang="scss">
	.k-scroll-load {
		.swiper {
			height: 100%;
			.swiper-item {
				height: 100%;
				.k-scroll-view {
					height: 100%;
					width: 100%;
				}
			}
		}
		
		
		
	}

</style>
