Vue EasyUI 分類(lèi)

2020-06-24 11:40 更新

分類(lèi)（ Accordion ）允許您提供多個(gè)面板（ Panel ），并同時(shí)顯示若干個(gè)面板（ Panel ）。提供的每個(gè)面板（ Panel ）都有展開(kāi)和折疊的內(nèi)建支持。用戶(hù)可自定義被選中的面板（ Panel ）。若未指定，則默認(rèn)選中第一個(gè)面板（ Panel ）。

屬性列表

名稱(chēng)	數(shù)據(jù)類(lèi)型	作用描述	默認(rèn)值
border	boolean	是否顯示邊框。	true
multiple	boolean	為T(mén)rue時(shí)展開(kāi)多個(gè)面板。	false
animte	boolean	定義展開(kāi)或折疊面板時(shí)是否顯示動(dòng)畫(huà)效果。	false
selectedIndex	number, array	已初始化的選中面板索引。	0

事件列表

名稱(chēng)	參數(shù)	作用描述
panelSelect	panel	選中面板時(shí)觸發(fā)。
panelUnselect	panel	未選中面板時(shí)觸發(fā)。

方法列表

名稱(chēng)	參數(shù)	返回值	作用描述
select	index	void	選擇指定的面板。
unselect	index	void	取消選擇指定的面板。
getPanel	index	AccordionPanel	獲得指定面板。
getPanelIndex	panel	number	獲得指定面板索引。
getSelectedIndex	none	number	獲取第一個(gè)選中面板的索引。
getSelectedPanel	none	AccordionPanel	獲取第一個(gè)選中的面板。
getSelectedPanels	none	AccordionPanel[]	獲取所有選中的面板。

注：
- 繼承： None 。

使用方法

<Accordion style="height:250px">
  <AccordionPanel :title="'Title1'">
    <p>Hello user.</p>
  </AccordionPanel>
  <AccordionPanel :title="'Title2'">
    <p>Welcome to W3Cschool.</p>
  </AccordionPanel>
  <AccordionPanel :title="'Title3'">
    <p>You'll learn something.</p>
  </AccordionPanel>
</Accordion>

分類(lèi)面板（ AccordionPanel ）

分類(lèi)面板（ AccordionPanel ）選項(xiàng)繼承自面板（ Panel ），以下是附加屬性：

名稱(chēng)	數(shù)據(jù)類(lèi)型	作用描述	默認(rèn)值
selected	boolean	是否選擇面板。	false

方法列表：

名稱(chēng)	參數(shù)	返回值	作用描述
select	none	void	選擇面板。
unselect	none	void	取消選擇面板。

以上內(nèi)容是否對(duì)您有幫助：

← Vue EasyUI 面板

Vue EasyUI 選項(xiàng)卡 →

寫(xiě)筆記

我要補(bǔ)充