element-plus-collapse

Document Element Plus Collapse component attributes, events, slots, and exposes.

7|Updated Mar 31, 2026
One-click install
npx skills add https://github.com/wepn13232/element-plus-skills --skill element-plus-collapse
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: element-plus-collapse
Source: https://github.com/wepn13232/element-plus-skills/tree/main/collapse
Command: npx skills add https://github.com/wepn13232/element-plus-skills --skill element-plus-collapse

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Element Plus Collapse API reference ensures you never have to search across docs when configuring accordion behavior, custom icons, or active panel control for your Vue 3 UI layout.

Core Features & Use Cases

  • Attribute Deep Dive covers el-collapse and el-collapse-item props such as model-value in accordion mode, expand icon placement, and disabled panels to tune behavior precisely.
  • Event and Slot Guidance explains the change event payload plus default slot usage to customize collapse content and react to panel switches.
  • Expose Reference delivers computed helpers like activeNames and setActiveNames so you can programmatically sync panel states while building interactive dashboards.

Quick Start

Ask the skill to summarize el-collapse attributes, events, and item options for your accordion layout.

Frequently Asked Questions about element-plus-collapse

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I configure el-collapse accordion mode in Vue 3?

Yes, you can customize expand and collapse icons in Element Plus Collapse by configuring icon options within the el-collapse-item attributes. This allows precise tuning of interactive UI detailing for panel headers.

What events does Element Plus Collapse trigger when switching panels?

Element Plus Collapse triggers a change event when switching panels, passing the updated active names as the event payload. You can use this event to react to panel switches and sync states in your Vue 3 application.

How do I programmatically control active panel states in el-collapse?

You can programmatically control active panel states using exposed helpers like activeNames and setActiveNames provided by the el-collapse component. These exposes allow you to directly sync panel states while building interactive dashboards.

Can I disable specific panels in an Element Plus accordion layout?

Yes, you can disable specific panels in an Element Plus accordion layout by applying the disabled attribute to el-collapse-item. This prevents user interaction with the targeted collapse panel without disabling the entire component.