移动端如何监听滚动

Question

做了个搜索功能，搜索后获取数据刷新列表。
但是后台做了分页，因为如果搜到的内容足够的多，就不太合适了。
这里的解决是，后台一次只返回15条数据，
等到滚动到快完的时候，再请求，把目前的最后一条数据的id(第15条的id)返给后台，可以请求16-30条数据……以此类推。

但是做的是移动端，用的vue和weui，然后我听同事说移动端没有scroll事件，但是我搜的话搜到一些插件(比如better-scroll等)

问题是，我不太想用插件，能不能自己实现一个，滚动监听：
比如：div高度200px，获取的15条内容高度是300px，等滚动到90%左右的时候，请求后台获取数据push到当前数据。

下面贴个图：

代码其实……贴不贴就那样了，懂我描述的意思就行，我想我描述的应该很明确了，不过以防……emm……还是贴点没什么卵用的代码：

<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>

代码完毕。
先在这里谢谢各位大神了，小弟不才，代码垃圾，还望大神们海涵。

Answer 1

有滚动时间，直接侦听容器的 scroll 事件即可。

Answer 2

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