How to listen for scrolling on the mobile end

made a search function to get the data to refresh the list after searching.
but paging is done in the background, because if enough content is found, it is not appropriate.
the solution here is that the backend only returns 15 pieces of data at a time.
wait until the scrolling is almost finished before requesting to return the id of the current last data (Article 15 id) to the background. You can request 16-30 pieces of data. and so on.

but what I do is mobile, using vue and weui, and then I hear colleagues say that there are no scroll events on the mobile, but if I search, I find some plug-ins (such as better-scroll, etc.)

the question is, I don"t really want to use plug-ins. Can I implement one by myself?
for example, the height of div is 200px, and the height of the 15 items obtained is 300px. when scrolling to around 90%, request the backend to obtain data push to the current data.

paste a picture below:

The

code is actually. Post it or not, just understand the meaning of my description. I think my description should be very clear, but just in case. Emm. Or paste the code that is useless:

<template>
    <div>
        <div>
            <input v-model="value" />
            <button></button>
        </div>
        <div class="searchListBox">
            <ul>
                <li v-for="item in items">{{item.nam}}</li>
            </ul>
        </div>
    </div>
</template>

<script>
export default {
    data() {return{
        items: []
    }},
    methods: {
        getData() {
            //ajax
            this.items = data;
        }
    }
}
</script>
The

code is complete.
first of all, I would like to thank all the great gods, my little brother is not talented, the code is rubbish, but also look at the big gods Haihan.

Mar.17,2021

mounted() {
    document.addEventListener('scroll', () => {
    })
}


has scrolling time, so you can listen to the scroll event of the container directly.

Menu