vue中滚到页面最底部scrollTop不生效，解决

需要注意几点

<template>
  <div ref="main"  style="height:500px;overflow:auto;">
    <div  class="scrolldivmain" @click="scrollToBottom" style="height:3000px;width:80vw;background-color: aqua;"></div>
  </div>
</template>

<script>
export default {
  name: 'Thild6-to',
  mounted(){
    let that=this
    this.$nextTick(()=>{
       let main=that.$refs.main
      main.scrollTop = main.scrollHeight    
    })
  },
}
</script>

<style>

</style>

1.滚动的div必须是父级，2.父级需要设置overflow：auto和高度，3.子级高度比父级高度高

methods:{
    scrollToBottom(){
      let that=this
    this.$nextTick(()=>{
       let main=that.$refs.main
      main.scrollTop = main.scrollHeight    
    })
    }
  }

点击子页面后直接滚动到父级最底端