Javascript Vue2：当页面有不同高度的图像时，如何滚动到底部？

我正在使用vue2框架。我有一个这样的用户案例：当页面第一次加载时需要滚动到底部。目前我的解决方案如下：

this.feeds = feeds // this is the data need to render to dom
this.$nextTick(function () {
    this.isLoaded = true
        let el = document.getElementsByClassName('chat-msgbox-wrap')[0]
        el.scrollTo(0, el.scrollHeight) 
    })

---

嗯，在大多数情况下，这是可行的。挑战是，当我们需要渲染图像时，虽然在nextTick回调中它已经被注入dom，但图像的高度并不准确，因为它可能在渲染过程中发生变化。所以效果是，当我第一次加载时，滚动条位于底部，但在所有图像完全渲染后，滚动条不在底部，因为图像高度发生了变化。我考虑使用<代码> MutationObserver < /代码>，但是它似乎不能观察元素的滚动高度属性。我有什么好办法解决这个问题吗？顺便说一下，我不能为图像设置固定的高度，我们只允许设置固定的宽度并让高度变化。

我找到了一个有用的工具，我们可以根据它编写一个指令

你是如何进行延迟加载的？通常，lazyloader库会有一个

load

事件处理程序来处理lazyload完成后的事情。对不起，我已经编辑了上面的问题，因为出于性能考虑，不允许导入lazyloader库。