element ui的el-scrollbar组件介绍

element官网文章中没有介绍滚动条的使用方式，但是官方中有滚动条的样式代码,这里主要介绍下el-scrollbar的一些属性

模块

el-scrollbar 组件有以下几个模块的内容：

• el-scrollbar ：需要指定高度
• el-scrollbar__wrap：包裹滚动区域
• el-scrollbar__bar is-horizontal：横向滚动条
• el-scrollbar__bar is-vertical：纵向滚动条

如果不需要横向滚动条（不加scoped）

<style lang="scss">
    /* element滚动条组件 隐藏水平滚动条 */
    .sidebar-wrapper .el-scrollbar__wrap {
        overflow-x:  hidden;
    }
    .is-horizontal {
        display :  none;
    }
</style>` 

el-scrollbar本身class不能带padding，不然会出现容器内外两个滚动条。

属性

el-scrollbar常用属性的理解：
   props: {
        native: Boolean,  // 是否使用本地，设为true则不会启用element-ui自定义的滚动条
        wrapStyle: {},  // 包裹层自定义的样式
        wrapClass: {},  // 包裹层自定义的样式类
        viewClass: {},  // 可滚动部分自定义的样式类
        viewStyle: {},  // 可滚动部分自定义的样式
        noresize: Boolean, // 是否不监听container尺寸变化，如果 container 尺寸不会发生变化，最好设置它可以优化性能
        tag: { type: String, default: 'div' }  // 生成的标签类型，默认使用 `div`标签包裹
    }