Accordion Library: Methods and Events with Examples

Last updated: 2 months ago

Category: Examples

The Accordion library can create nested collapsible panels and supports multiple data formats.

check() Method

The check() method requires enabling the feature first by setting check:true or check.enable:false. Similar to the select() method, it takes three parameters with identical syntax.

checkAll() Method

As the name suggests, checkAll() checks all branches, while uncheckAll() does the opposite.

lock() and unlock() Methods

lock() completely disables the entire tree, while unlock() re-enables it. Both support callback functions without parameters.

disable()和readonly()方法

These similar methods both provide disabling functionality:

• disable() completely disables branches
• readonly() only disables toolbox operations

add() Method

Adds new branches with these parameters:

edit() Method

The edit() method modifies branches and accepts three parameters:

graft() Method

The graft() method transfers branches and accepts a single configuration object parameter with these properties:

setVals() Method

Sets values with two parameters:

getVals() Method

Retrieves values with these parameters:

clearVals() Method

Clears selected branches and accepts an optional callback with no parameters.

expand() Methods

Expands parent branches with two parameters:

collapse()方法

collapse(): Collapses parent branches with same parameters as expand().

These methods are inverses of each other.

expandAll()/collapseAll() Methods

• expandAll(): Expands all parent branches
• collapseAll(): Collapses all parent branches

Both accept an optional callback with no parameters.

setContent() Method

Adds/updates branch content with three parameters:

Getting Current States

These methods retrieve various active states:

updateCont() Method

Updates the instance's content parameter with:

update()/reset() Methods

• update(): Refreshes all parameters with:

  1. settings: New parameters (matching options format)
  2. cb: Callback receiving updated options

• reset(): Restores initial state with optional callback. Reverts all option changes.

destroy()/init() Methods

• destroy(): Disables instance (remains in memory)
• init(): Reinitializes destroyed instance

Both support optional callbacks with no parameters.

b4Edit Event

Fires during edit() or toolbox label edits. Requires Promise resolution to proceed. Pass new values to resolve().

b4Graft Event

Fires during graft() or drag operations. Controls transfers via Promise resolution.

b4Init Event

All instances trigger this initialization event. Promise rejection blocks initialization until manual init().

b4Expand/b4Collapse Events

Intercept expand/collapse operations via Promise control:

• resolve() proceeds (optionally with new value)
• reject() blocks action

b4Add/b4Remove Events

Intercept branch additions/removals through Promise resolution:

• resolve() proceeds (can modify data)
• reject() blocks operation

Caching Data

• updateCache(): Manually saves state (requires storName parameter)
• clearCache(): Clears saved state

Event Listeners

In addition to standard events like ready, initiated, and destroyed, the component provides numerous custom events: