el-dialog设置滚动条不生效记录【草稿版，待优化】_el-dialog无法滚动

---

前言

提示：这里可以添加本文要记录的大概内容：

技术栈
element-plus + vue3 + js

记录el-dialog的弹窗中，通过js控制滚动条不生效。
我这次的需求是这样的，点击某个按钮传入参数查询进入一个上下文的弹窗，需要我手动控制滚动条，滚动到当前点击的item的地方，也就是当前item显示在弹窗的中间部分，并且高亮。弹窗里面是表格，我这边是通过js控制.el-dialog__body 这个滚动元素的滚动条实现的。但是遇到一个问题是，每当我想要scrollTop设置成最大高度scrollHeight的时候，总是不成功。

---

提示：以下是本篇文章正文内容，下面案例可供参考

一、scrollTop是什么？

scrollTop 属性可以获取或设置一个元素的内容垂直滚动的像素数。

一个元素的 scrollTop 值是这个元素的内容顶部（卷起来的）到它的视口可见内容（的顶部）的距离的度量。当一个元素的内容没有产生垂直方向的滚动条，那么它的 scrollTop 值为0。

在使用显示比例缩放的系统上，scrollTop 可能会提供一个小数。

二、解决步骤

通过观察，修改目标滚动元素的滚动样式即可。

/deep/.el-dialog__body {
    border: 1px solid red;
    padding: 10px;
    overflow: scroll;
}
1
2
3
4
5

---

总结

提示：这里对文章进行总结：

主要是自己对scrollTop这个属性了解的不够深入导致。