我在一个遗留代码库中工作，试图迁移到Vue。

在我的特定情况下(在引导模式中包装的可滚动div)， v-if显示了新内容，我希望页面向下滚动到这些内容。为了让这种行为工作，我必须等待vue完成重新渲染，然后使用jQuery滚动到模态的底部。

所以…

this.$nextTick(function() {
    $('#thing')[0].scrollTop = $('#thing')[0].scrollHeight;
})

$(document).ready(function() {
    let width = $(window).width();
    let element = $("#YourId");
    let positionFromTop = element.offset().top + element.prop("scrollHeight");
    $("html, body").animate({
        scrollTop: Math.abs($(window).height() - positionFromTop)
    }, 500);
});

这些都不适合我，我在一个网页应用程序中有一个类似于Facebook messenger的消息系统，并希望消息出现在div的底部。

这是一个基本的Javascript。

window.onload=function () {
     var objDiv = document.getElementById("MyDivElement");
     objDiv.scrollTop = objDiv.scrollHeight;
}

滚动窗口到目标div的底部。

function scrollToBottom(id){
  div_height = $("#"+id).height();
  div_offset = $("#"+id).offset().top;
  window_height = $(window).height();
  $('html,body').animate({
    scrollTop: div_offset-window_height+div_height
  },'slow');
}

scrollToBottom('call_div_id');

我在一个遗留代码库中工作，试图迁移到Vue。

在我的特定情况下(在引导模式中包装的可滚动div)， v-if显示了新内容，我希望页面向下滚动到这些内容。为了让这种行为工作，我必须等待vue完成重新渲染，然后使用jQuery滚动到模态的底部。

所以…

this.$nextTick(function() {
    $('#thing')[0].scrollTop = $('#thing')[0].scrollHeight;
})

你可以检查scrollHeight和clientHeight与scrollTop滚动到div底部像下面的代码。

$ (' # div ')。滚动(函数(事件){ if ((parseInt($('#div')[0].scrollHeight) - parseInt(this.clientHeight)) == parseInt($('#div').scrollTop())) ｛ Console.log("这是div的滚动底部"); ｝ })；