The scroll bar in Vue is always positioned at the bottom

The scroll bar in Vue is always positioned at the bottom of the scroll bar positioned at the bottom, the first thought is that the dynamic modification of the scroll bar to the top of the distance equal to the height of the div, code implementation: var div = document.getElementById (' data-list-content ') Div.scrolltop = Div.scrollheight But the problem comes, the scroll bar does not reach the bottom, but the distance from the bottom of a little distance (a face Meng) is estimated to be dynamic loading data, the data is not loaded, the scroll bar has been executed, know the reason, then practice Bai. Second attempt, using Vue watch to monitor data changes, and then dynamically modify the scroll bar to the top of the distance code implementation: Watch: {' processdata ': ' Scrolltobottom '} scrolltobottom:function () {V Ar div = document.getElementById (' data-list-content ') Div.scrolltop = div.scrollheight} crashes again, as if there were no hairs (stuck in a puzzled). This time I thought of $nextTick. The simple introduction of the $nexttick:vue implementation response is not a change in the DOM immediately after the data changes, but a certain strategy to update the DOM. The $nextTick is to perform a deferred callback after the next DOM update loop, which is used after the data has been modified. Since $nexttick was executed at the next DOM update, it didn't exactly meet our requirements (small excitement). Code implementation: Watch: {' processdata ': ' Scrolltobottom '} scrolltobottom:function () {this. $nextTick (() = {var div = documen T.getelementbyid (' data-list-content ') div.scrolltop = Div.scrollheight})} ran the code and succeeded.