Vue EasyUI 面板

2020-06-24 11:40 更新

面板( Panel )可當做其他內(nèi)容的容器使用。 面板( Panel )是創(chuàng)建其他組件(布局( Layout )、選項卡( Tabs )、折疊面板( Accoedion )等)的基礎(chǔ)組件。 面板( Panel )提供內(nèi)置的可折疊、可關(guān)閉、可最大化、可最小化的行為以及其他自定義行為。 面板( Panel )可嵌入到網(wǎng)頁的任意位置。

屬性列表

名稱 數(shù)據(jù)類型 作用描述 默認值
border boolean 是否顯示邊框。 true
title string 在面板標題中顯示的文本。 null
iconCls string 在面板標題上顯示16x16圖標的CSS類。 null
closed boolean 面板是否關(guān)閉。 false
collapsed boolean 面板是否已折疊。 false
collapsible boolean 是否在標題上顯示可折疊按鈕。 false
showHeader boolean 是否顯示標題。 true
showFooter boolean 是否顯示頁腳。 true
expandIconCls string 展開圖標的樣式類。 panel-tool-expand
collapseIconCls string 折疊圖標的樣式類。 panel-tool-collapse
panelCls string 面板樣式類。 null
panelStyle Object 面板內(nèi)聯(lián)樣式。 null
headerCls string 面板標題樣式類。 null
headerStyle Object 面板標題內(nèi)聯(lián)樣式。 null
bodyCls string 面板主體樣式類。 null
bodyStyle Object 面板主體內(nèi)聯(lián)樣式。 null
footerCls string 面板頁腳樣式類。 null
footerStyle Object 面板頁腳內(nèi)聯(lián)樣式。 null

插槽

名稱 參數(shù) 作用描述
header none 面板頭部域。
footer none 面板頁腳域。

注:
- 繼承: None 。

使用方法

通過 HTML 標記創(chuàng)建面板( Panel )。

<Panel title="Panel Title" :collapsible="true" :bodyStyle="{padding:'20px'}" style="height:200px">
  <p>W3Cschool.cn</p>
</Panel>
以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號