element ui 步驟條的使用

2021-08-30 15:32:19 字數 519 閱讀 1676

由於專案中有用到步驟條,在這個過程中,也遇到了坑,可能還是自己能力不足。。。糾結好久

element-ui中步驟條的基本使用方法如上圖所示,更加具體的可以去element-ui的官網檢視。由於頁面要相容不同螢幕寬度,所以在專案中設定了space的值為20%,居中樣式看著可能更好一點。但是它也存在乙個問題,是不支援英文本母自動換行的,所以得自己手動設定word-break: break-all

現在來說一下專案中的要求: 

除了title和description的展示,下面還增加了時間和原因的展示.....

因為這個元件只有title和description兩個屬性,所以下面時間的展示和原因就有點困難了,還得對應到當前的步驟。我的解決辦法就是去找步驟的原始碼,仿照原始碼又寫了乙個元件,其中一部分都是本來元件都有的直接拿來用了

使用方法如下:

}

Element UI 使用步驟

element ul是餓了麼前端團隊推出的一款基於vue.js 2.0 的桌面端ui框架,手機端有對應框架是mint ui 官網 現在vue引入element 1.開啟cmd,進入到當前剛建立的vue專案目錄 cd e download my xlzb vue demo 2.在當前目錄中執行 npm...

element ui的滾動條的使用

如何使用element ui 自帶的滾動條 在需要滾動條的容器外層 需要滾動條的容器 這個容器需要限定高度哦 如height 100 如height calc 100 60px 等 全域性樣式 如果只需要y軸的滾動條 el scrollbar wrap el scrollbar bar.is hor...

使用elementUI滾動條之橫向滾動

用過elementui元件應該會知道它內建乙個滾動效果,官網對此元件沒有相關文件,也是細心發現的。將會出現滾動的內容放到上述標籤內就可以了。這裡要簡單的設定一下,將標籤的height設為100 讀者檢視效果的時候,會出現乙個橫向的滾動條,如果你不想要橫向的滾動條,使用下面css屬性設定就可以只顯示豎...