検索

ホームページ  >  に質問  >  本文

JavaScript - 画像をスクロールして読み込む vue

要件: スクロール バーを一番下まで引き下げたときに画像をロードします。一度に 6 枚の画像をロードします。画像の数が 30 を超える場合は、ロード後に最初の 6 枚の画像を削除し、30 個の dom ノードを保持します。

これが今のやり方です データに imgarr=[] を画像アドレスを格納する配列として設定します まずスクロール要素の clientHeight、scrollTop、scrollHeight の値を取得し、変数 switch isload = true. clientHeightscrollTop >scrollHeight - 30 で、isload が true の場合、それをロードし、isload を false に設定し、ロードされた画像アドレスを imgArr に追加します。問題は、画像の数が 30 に達したときです。 , 読み込んだ画像を imgArr に連結し、this.nextTick 内の imgArr の最初の 6 つの画像アドレスを削除すると、スクロール バーがスクロールしないことがわかります。問い合わせてみたところ、this.nextTickのときのscrollHeightの値が前回の値であり、ロードしたdomの高さが含まれていないことがわかり、この時に問題が発生したのですが、この問題に遭遇した人はいますか?

リーリー リーリー
阿神阿神2834日前704

全員に返信(2)返信します

  • 迷茫

    迷茫2017-05-18 11:01:25

    this.nextTick は this.setTimeout(,0) に置き換えられます

    返事
    0
  • 我想大声告诉你

    我想大声告诉你2017-05-18 11:01:25

    プラグインの使用を検討してみてはいかがでしょうか: https://peachscript.github.io...

    返事
    0
  • キャンセル返事