element ui元件提高了不少開發效率,使用 dialog 對話方塊的時候發現,元件說明文件提供了 width 來設定 dialog 的寬度,並沒有給出如何固定高度。
對話方塊的高度會隨著對話方塊中內容的多少而變化,如下所示:
內容太多時:
這樣造成的體驗很不好,所以,為了能夠防止內容超出彈框,並且一直看到footer裡的按鈕,需要固定對話方塊的高度,我的解決辦法是:
在對話方塊內容元素的外面加乙個 div,然後設定 div 的高度,並且設定 overflow: auto,這樣,內容超出時會出現滾動條,可以進行滑動,如下:
"roleresdialo**isible" title=
'授權' width=
"25%" center>
="dialogdiv"
>
-expand-all check-strictly>
<
/el-tree>
<
/div>
"footer"
class
="dialog-footer"
>
"roleresdialo**isible=false"
>
}<
/el-button>
"primary" @click=
"roleresconfirm"
>
}<
/el-button>
<
/span>
<
/el-dialog>
Dialog對話方塊
確認對話方塊 單選按鈕對話方塊 多選按鈕對話方塊 列表對話方塊 一 確認對話方塊alertdialog alertdialog.builder builder new alertdialog.builder this 設定名字 builder.settitle 確認對話方塊 設定圖示 builder...
Dialog對話方塊
一 常用的對話方塊 普通對話方塊 單選對話方塊 多選對話方塊 自定義對話方塊 水平進度條對話方塊 圓形進度條對話方塊 日期選擇對話方塊 時間選擇對話方塊 普通對話方塊 button.setonclicklistener new view.onclicklistener builder.setnega...
Element 對話方塊 Dialog
在 dialog取消按鈕或者在對話方塊關閉的before colse事件中新增 closediglog 注意 清空表單一定要給el form item新增prop屬性,不然重置表單無效 上面為一種清空方式 還有種清空方式為 最簡單粗暴就是在dialog對話方塊新增v if,下次開啟對話方塊重新渲染即...