解决页面数据重复问题。

最近在开发一个项目中遇到页面数据重复问题，自己思考了一下大概问题出哪，是因为加了分页的效果，当页面触底时，会再次请求，大家先看一下分页的处理。

if (that.pages == 1) {
    that.shopList = res.data.data
 } else {
    if (that.shopList.length == 0) {
        that.shopList = res.data.data
    } else {
        res.data.data.forEach(item => {
           that.shopList.push(item)
       })
     }
 }

这样处理的话，当网速过慢时，会出现如下问题：

 当刚进入页面时，由于数据加载过慢，数据还没渲染上去就直接触底了，所以直接走了else直接就把数据push进去了就出现了数据重复问题。

所以我在push前有对数据进行了处理：

if (that.pages == 1) {
    that.shopList = res.data.data
} else {
    if (that.shopList.length == 0) {
        that.shopList = res.data.data
    } else {
        res.data.data.forEach(item => {
            let flag = that.shopList.every(citem => {
                if (citem.data.id != item.data.id) {
                      return true
                 }
               })
                if (flag) {
                    that.shopList.push(item)
                  }
                })
              }
            }

在push前，利用every方法循环原数组，当原数组中不存在就会返回true，每次循环是true是就push进去，false不进行处理，这样就可以解决数据重复的问题了。

这个问题的出现可能不是这个原因，但是解决的办法还是有用的，希望可以帮到大家，如果有什么更好的意见欢迎评论。