【Element-UI的隐藏组件】自定义滚动条

el-scroll-bar.gif

官网效果
无意间发现element官网有这么一个滚动条效果，之前在一个需求上想做这样的效果，碍于当时脑筋短路没实现。感觉像是通过active或者focus触发显示滚动条，查看html后发现确实是通过active出触发。且它这样式很规整，就怀疑是不是有写好的组件。
查看了element代码后发现确实有这么个组件，只是没有在官网API上声明，目前发现只是在el-select下拉框中内部使用。

简单分享下该组件用法和参数

基础用法

  ...内容...

使用该组件的时候需要给其一个高度，它毕竟是滚动条组件，高度是对它最起码的尊重。组件默认overflow为：scroll，如果需要去掉横向滚动条可以设置overflow-x样式。

Attribute

参数	说明	类型	可选值	默认值
native	是否使用原生滚动条样式	boolean	—	false
wrapStyle	wrap层style	Array/String	—	—
wrapClass	wrap层class	String	—	—
viewStyle	view层style	Array/String	—	—
viewClass	view层class	String	—	—
noresize	是否添加resize监听	boolean	—	false
tag	view层html标签	String	—	div

html

  

    

      ...内容...