如何搭配 el-scrollbar 和 el-backtop，使其点击后滚动到底部：

<template><!-- 一个el-scrollbar区域，其ref是chatArea --><el-scrollbar @scroll="(e: any) => { tempHeight = e.scrollTop }" ref="chatArea" always></el-scrollbar><el-backtop :right="40" :bottom="195" :visibility-height="0" @click="goToPlace" /><!-- 如果要滚动到最顶部，则可以将goToPlace中的top设为0，或者直接用target --><!-- <el-backtop :right="40" :bottom="195" :visibility-height="0" target=".chat-area .el-scrollbar__wrap" /> -->
</template>
<script>
const goToPlace = () => {chatArea.value!.scrollTo({top: chatArea.value.wrapRef.scrollHeight,behavior: 'smooth'})
}
</script>
<style scoped lang="scss">/** 如果是要滚动到最底部，则应该让svg箭头图标指向下方 */:deep(.el-backtop svg) {transform: rotate(180deg);}
</style>

另外，当鼠标单击被el-scrollbar包围的区域，然后按下enter键，会发现这时el-scrollbar区域被一圈黑框围起来了，其实这是它的outline属性没被隐藏。解决办法：

:deep(.el-scrollbar__wrap.el-scrollbar__wrap--hidden-default:focus) {outline: none;
}