基於vue的滾動條組件之--element隱藏組件滾動條scrollbar使用
在項目中,總是需要用到滾動條,但windows瀏覽器默認的滾動條是很丑的,為了頁面美觀,可以考慮優化滾動條樣式。
vue Element UI官方文檔上並沒有放出滾動條相關的示例說明,但是實際上是有這么一個組件的,可查看源碼。
<el-scrollbar></el-scrollbar>
將會出現滾動的內容放到上述標簽內就可以了。
這里要簡單的設置一下,將標簽的height設為100%,查看效果的時候,會出現一個橫向的滾動條,如果你不想要橫向的滾動條,使用下面css屬性設置就可以只顯示豎向滾動條。
.el-scrollbar__wrap {
overflow-x: hidden;
}
示例使用方法如下: