Vue scroll bar scrolls to top or bottom

1: Add ref="mianscroll" to the div to which the scroll bar belongs (the name of mianscroll is optional)

<div ref="mianscroll">
  //中间内容
</div>

2: click event to top

topScrollClick() {
    
    
   this.$nextTick(() => {
    
    
     let scrollEl = this.$refs.mianscroll;
     scrollEl.scrollTo({
    
     top: 0, behavior: 'smooth' });
   });
 },

3: click event to the bottom

bottomScrollClick() {
    
    
      this.$nextTick(() => {
    
    
        let scrollEl = this.$refs.mianscroll;
        scrollEl.scrollTo({
    
     top: scrollEl.scrollHeight, behavior: 'smooth' });
      });
}

Note: the above method must be added to the div to which the scroll bar belongs, otherwise it will not take effect. The style of the scrolling div is overflow:auto