<template>
    <view class="menu">
        <scroll-view 
            id="scrollContainer" 
            class="scroll" 
            scroll-y 
            @scrolltolower="handleScrollToLower"
            >
            <view class="item">1</view>
            <view class="item">2</view>
            <view class="item">3</view>
            <view class="item">4</view>
            <view class="item">5</view>
        </scroll-view>
    </view>
</template>

<script>
    export default {
        data() {
            return {

            }
        },
        methods: {
            handleScrollToLower(){
                console.log('已经滚动到底部了');
            }
        }
    }
</script>

<style scoped>
.item {
    height: 300rpx;
    width: 100%;
    background-color: beige;
    border-bottom: 5rpx solid orange;
}

.scroll{
    height: 770rpx;
}
</style>