有滚动条的时候，设置盒子的位置

     <div class="AIBox mt-24" id="AIBox">
        <div v-for="(v, i) in AIs" :key="i" :class="v.role == 'assistant' ? 'mb-24' : ''">
          <div :class="v.role == 'user' ? 'fc-ac42f3 fw-600 font-16' : ''">
            {{ v.content }}
          </div>
        </div>
        <div class="tc">
          <img id="ganImg" style="width: 100px; height: 100px" src="../assets/emages/loading.gif" alt=""
            v-if="loading" />
        </div>
      </div>

给AIbox添加css样式，一定要overflow-y: auto;

<style scoped>
.AIBox {
  font-size: 14px;
  line-height: 22px;
  width: 800px;
  height: calc(100vh - 300px);
  overflow-y: auto;
  padding-right: 16px;
}
</style>

js代码

    nextTick(()=>{
    var div = document.getElementById('AIBox')
    div.scrollTop = div.scrollHeight
  })