el-scrollbar 获取滚动条高度 并将滚动条保持在低端

首先我们用ref绑定一个 scrollbar

  <el-scrollbar style="height: 100%;" ref="chatScrollRef" @scroll="scrollTest">

用scroll触发滚动事件，一路滚到最底下，观察三个属性

const scrollTest = ({scrollTop}) => {console.log(scrollTop);const wrap = chatScrollRef.value?.wrapRefif (wrap) {console.log("------" + wrap.scrollHeight);console.log("++++++" + wrap.clientHeight);}
}

得出结论，当 scrollTop + clientHeight = scrollHeight 的时候，滚动条会达到最低端

1. 得到滚动条距离顶端高度

先绑定ref

const wrap = chatScrollRef.value?.wrapRef
console.log(wrap.scrollTop);

2. 将滚动条调整在最低端

先绑定ref

const scrollToBottom = () => {const wrap = chatScrollRef.value?.wrapRefif (wrap) {wrap.scrollTop = wrap.scrollHeight - wrap.clientHeight}})