在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ vue.js滾動條下拉,數(shù)據(jù)重復(fù)渲染

vue.js滾動條下拉,數(shù)據(jù)重復(fù)渲染

get_productsList:function(){

            // 緩存指針
            var _this=this;
            // 設(shè)置一個開關(guān)來避免重負(fù)請求數(shù)據(jù)
              let sw = true;
            let adrObj = {
                'path': misslove.path,
                'page':1
            }
            console.log(adrObj)
            this.$http.post(misslove.host+"/index.php?route=product/category/get_products",adrObj,{emulateJSON:true}).then(
                function (res) {
                    // 處理成功的結(jié)果
                    console.log(res.data)
                    var re = res.data;
                    if(re.code=="200"){
                        _this.products= re.products;
                    }
                },function (err) {
                    // 處理失敗的結(jié)果
                    console.log(err)
          });
             let isLoading = false
                window.onscroll = () => {
                // 距離底部200px時加載一次
                    let bottomOfWindow = document.documentElement.offsetHeight - document.documentElement.scrollTop - window.innerHeight <= 200  
                       if (bottomOfWindow && isLoading == false) {
                            // 將開關(guān)關(guān)閉
                           isLoading = true
                           
               this.$http.post(misslove.host+"/index.php?route=product/category/get_products",{'path': misslove.path,'page':page++},{emulateJSON:true}).then(
                function (res) {
                    console.log(res)
                    //數(shù)據(jù)重復(fù)位置
                    var pists  = res.data.products;
                      if (!pists) pists = [];
                      var $arr = _this.products;
                      for (let i = 0; i < pists.length; i++) {
                        if (pists[i].Access != 0) {
                         $arr.push(pists[i]);

// _this.products.push(pists[i])

                        }
                    }
                      _this.products = $arr;
                      console.log(_this.products)
                      
                },function (err) {
                    // 處理失敗的結(jié)果
                    console.log(err)
                    });

                // 數(shù)據(jù)更新完畢,將開關(guān)打開
                           isLoading = false
                       }
                  }
        },

數(shù)據(jù)一共有26條,一頁顯示20條,現(xiàn)在res這里先渲染出來20條再渲染出來6條,又重復(fù)渲染了20條 ,數(shù)據(jù)重復(fù)、?????

回答
編輯回答
假灑脫

push是往里面追加,在下拉的時候先清空數(shù)組,在push 每次下拉觸發(fā)一次清空就行了

2018年1月8日 21:21