Element-UI 框架 el-scrollbar 組件

前言

咱們在 Element-UI 的其餘組件裏發現，有使用這個組件，而且還不錯，因爲 Element-UI 官方文檔並無寫到關於 el-scrollbar 的文檔，因此穩定性上多是有些問題，這裏只是爬了源碼，翻譯了一些屬性的使用，僅供參考

快速使用

<el-scrollbar>
    <li v-for="user in userList" :key="user.id">{{user.name}}</li>
</el-scrollbar>

複製代碼

具體實例

<el-scrollbar wrapClass="yf-container" viewClass="yf-content" wrapStyle="color:'#fff';fontSize:'16px';" viewStyle="color:'#fff';fontSize:'16px';" :native="false" :noresize="true" tag="ul" >
    <li v-for="user in userList" :key="user.id">{{user.name}}</li>
</el-scrollbar>

複製代碼

結構構成

文檔

Attribute

參數	說明	類型	可選值	默認值
wrapClass	可選參數，容器的樣式名	string	-	-
viewClass	可選參數，展現視圖的樣式名	string	-	-
wrapStyle	可選參數，容器的樣式	string	-	-
viewStyle	可選參數，展現視圖的樣式	string	-	-
native	可選參數，是否使用原生滾動	boolean	-	false
noresize	可選參數，容器大小是不是不可變的	boolean	-	false
tag	可選參數，渲染容器的標籤	string	-	div

備註

源碼 github.com/ElemeFE/ele…

文章 element ScrollBar滾動組件源碼深刻分析