el-tag

Render labeled el-tag components with attributes and events in Vue 3.

21|2|Updated Mar 13, 2026
One-click install
npx skills add https://github.com/jiaiyan/element-plus-skills --skill el-tag-jiaiyan
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: el-tag
Source: https://github.com/jiaiyan/element-plus-skills/tree/main/components/el-tag
Command: npx skills add https://github.com/jiaiyan/element-plus-skills --skill el-tag-jiaiyan

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Tagging UI elements for labeling, categorization, and quick filtering, reducing cognitive load and improving content organization.

Core Features & Use Cases

  • Tag attributes support type, closable, size, effect, and round styling for visual variety.
  • Includes a selectable variant via el-check-tag and events for click and close to respond to user actions.
  • Enables common use cases such as category labels, status indicators, removable filters, and selection markers in Vue applications.

Quick Start

Create a small set of tags using el-tag (and optionally el-check-tag) in a Vue template to display labels and enable user interaction.

Frequently Asked Questions about el-tag

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

FAQPage Schema
How do I add closable tags for filtering in a Vue 3 dashboard?

Closable tags for filtering in a Vue 3 dashboard are added using the el-tag component with the closable attribute, enabling removable filter chips that respond to close events for dynamic content management.

What is the best way to display status indicators and category labels in Element Plus?

The best way to display status indicators and category labels in Element Plus is using el-tag, which supports type, size, effect, and round styling attributes to provide quick visual cues for UI categorization.

Can I use el-check-tag for selectable tag variants in Vue forms?

Yes, you can use el-check-tag for selectable tag variants in Vue forms to act as selection markers, responding to click events to toggle states and manage dynamic user selections.

Does the Element Plus tagging component support click and close event handlers?

Yes, the Element Plus tagging component supports custom click and close event handlers, allowing developers to execute specific logic when users interact with or remove tags in lists and forms.

When should I use UI tags for content organization in a Vue application?

You should use UI tags for content organization in a Vue application when managing dashboards, lists, or forms, as they reduce cognitive load by providing quick visual cues and enabling efficient categorization.