vue el-scrollbar

Vue的element-ui库中提供了一个名为el-scrollbar的组件，用于实现带滚动条的容器。使用el-scrollbar组件可以方便地实现一个带有滚动条的容器，并且可以自定义滚动条的样式和行为。

以下是一个简单的el-scrollbar组件的示例：

<template>
  <el-scrollbar style="height: 200px;">
    <div class="content" style="height: 500px;">
      <!-- 这里是容器的内容 -->
    </div>
  </el-scrollbar>
</template>

<script>
import { ElScrollbar } from 'element-ui'

export default {
  components: {
    ElScrollbar
  }
}
</script>

<style>
/* 自定义滚动条样式 */
.el-scrollbar__thumb {
  background-color: #666;
  opacity: 0.4;
}
.el-scrollbar__bar {
  width: 5px;
}
</style>

在上面的示例中，el-scrollbar组件被用作一个容器，它的高度被设置为200px。在容器中有一个高度为500px的内容区域，当内容超出容器高度时，会自动出现滚动条。同时，通过自定义样式，我们可以修改滚动条的样式和行为。