Vue无限滚动加载数据，无插件

搭建的一个项目用的是mint-ui的无限滚动插件，但是运用上去没效果，百度了半天，都说是什么高度问题，好吧 我设置了高度，依然不行，所以我就想着不用插件了 自己弄个出来，根据百度大佬们的说法，自己琢磨了一下，废话不多说，上代码。

首先

先在div框里设置ref，当然你也可以用jq，但我这里没有jq，所以就直接这样获取dom了

template内容

data里面最重要的是onFetching这个控制器了，控制无限滚动，必须要的，不然真·无限滚动了

data内容

---

好的，下面是重点了。

在created钩子函数操作dom是需要放在$nextTick的回调函数里，想了解请去官网看下文档

别问为什么不在mounted里面写，问就是不知道.

然后就开始获取dom对象了，需要获取滚动条的垂直高度，div框的高度，和滚动区域的高度

然后就开始判断控制器了，防止不停加载

如果不懂判断区域的条件可以打印出来看下就知道了，设置定时器是为了不让用户不停往下滑造成的加载数据太快，因为太快了可能会有什么bug之类的东西出现

一开始进入页面的时候是需要加载一次数据的，在mounted里面加载1次，然后就按下面的写了，很简单的

concat()的作用是拼接2个数组，想看更详细请百度吧

获取数据

好了，大概的过程就这样子，可能加载的时候没有什么提示的，这个就需要自己加点什么东西了，本期就到这里结束了。