鍍金池/ 問(wèn)答/HTML/ better-scroll,refresh后解析有誤

better-scroll,refresh后解析有誤

在vue中應(yīng)用better-scroll,初始化是OK的,在我根據(jù)條件篩選數(shù)據(jù)后,組件中數(shù)據(jù)發(fā)生變化,則調(diào)用refresh,在控制臺(tái)中打印結(jié)果發(fā)現(xiàn)解析有誤,導(dǎo)致內(nèi)容不能滾動(dòng)。
篩選數(shù)據(jù)這個(gè)行為可以類(lèi)比網(wǎng)購(gòu)時(shí)對(duì)品牌價(jià)格等條件的篩選。

this.$ajax.get(this.httpUrl, {
  //this.hrrpUrl為請(qǐng)求路徑
  params: {
    //拼接在URL中的參數(shù),此處略去
    //根據(jù)條件篩選數(shù)據(jù)事,里面有些參數(shù)的值會(huì)發(fā)生變化
  },
}).then((res) => {
  const returndata = res.returndata;
  if (!returndata.status) {
      this.dataList = returndata.data;
  if (this.dataList && this.dataList.length) {
    setTimeout(() => {
      if (!this.scroll) {
        console.log('初始化');
        this.scroll = new BScroll(this.$refs.goodsList, this.scrollObj);
        //this.scrollObj存儲(chǔ)在data中,內(nèi)容為click: true,probeType: 2,
        console.log(this.scroll);
        this.scroll.on('touchEnd', (pos) => {
          // 下拉動(dòng)作
          if (pos.y > 30) {
            this.pageNum = 1;
            this.getData();
          } else if (pos.y < this.scroll.maxScrollY - 30) {
            // 上拉動(dòng)作
            if (this.pageNum < this.totalPage) {
              this.pageNum += 1;
              this.loadMore = true;
              this.getData();
            }
          }
        });
      } else {
        console.log('refresh');
        this.scroll.refresh();
        console.log(this.scroll);
      }
    }, 200);
  }
});

下圖為控制臺(tái)打印結(jié)果

clipboard.png

下圖為初始化打印結(jié)果

clipboard.png

下圖為refresh后打印結(jié)果

clipboard.png

回答
編輯回答
傻丟丟

dom響應(yīng)數(shù)據(jù)變化重新渲染也需要一定時(shí)間的,你可以嘗試使用定時(shí)器中進(jìn)行refresh操作。

2017年5月1日 04:38
編輯回答
墨沫

那個(gè)啥, 現(xiàn)在better-scroll提供了下拉,上拉功能。當(dāng)確認(rèn)數(shù)據(jù)加載完成后,執(zhí)行finishPullDown()即可

2017年6月13日 05:00