背景：
在鼠标慢慢滚动，滚动到某一处位置的时候，滚动条自动触发，拼命往下走。正常应该是滑动到摸个位置时候，加载下一页的数据。
Video_2022-09-16_155954
这个问题困扰了我两天，特此记录。
用的Vant组件库的van-list来实现自动加载下一页数据。
解决思路：
1.因为出现现象是鼠标不动，但是滚动条会自动。所以我先考虑，是不是跟滚动条的事件有关。翻遍了代码，我也没有写鼠标滚动条事件啊，scrollTop都没有写。在这个思路我困在里面2个多小时，查阅网上资料无果，心态崩溃了1个多小时。
2.后面我就在想，是不是vant组件库的问题，里面的底部加载事件方法有问题。看了下，只是滑动到底的时候，去请求接口。也没啥了。（ps:想去看组件库源码，但是不知道源码在哪里看...好像是在node_modules里...)
3.来都来了，那会不会是接口的问题啊？想了想应该不会，但是我还是检查了一下（老爷保佑，找到了问题了）
请求回来的数据列表，第一页和下一页没有合并！！赶紧改正！！
总结：
从这个问题中，也暴露了es6扩展运算符的弱点。附上学习链接：
https://blog.csdn.net/astonishqft/article/details/82899965
找问题报错，果然还是得自己多思考啊，心态也很重要。每次想要放弃的时候，还好我告诉自己，再看20分钟，就不钻牛角尖了 。因为这样想，这次才能找到这个没有标红的报错。
相关代码：
<van-list
v-model="loading"
:finished="finished"
finished-text="没有更多了"
@load="onLoad"
:immediate-check="false"
offset="50"
>async getArticleListFn () {
// 获取文章列表
const res = await getAllArticleList({
channel_id: this.channelId, // 先默认请求 推荐频道 数据
timestamp: this.theTime
})
console.log(res)
this.list = [...this.list, ...res.data.data.results]
this.theTime = res.data.data.pre_timestamp
/* 底部加载 */
this.loading = false
if (res.data.data.pre_timestamp === null) {
// 本次回来的数据是最后，没有下一段数据了
this.finished = true
}
/* 顶部加载 */
// 顶部加载状态改为false
this.isLoading = false
},
// 底部加载事件方法
async onLoad () {
if (this.list.length === 0) {
this.loading = false// 第一次上面还是判定触底（触发onLoad方法时loading自动改true）
// 如果不改回来，下次触底就不再执行onLoad方法
// 如果页面没有数据，没有高度，让本次onLoad逻辑代码不往下执行
}
this.getArticleListFn()
},