skills.rest
wepn13232
wepn13232COMMUNITY
Explore all skills by this author →
GitHub

element-plus-progress

Document Element Plus el-progress component attributes, slots, and status values.

7|Updated Mar 31, 2026
Search Tags:#frontend#vue#progress#api-docs#element-plus#el-progress
One-click install
npx skills add https://github.com/wepn13232/element-plus-skills --skill element-plus-progress
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: element-plus-progress
Source: https://github.com/wepn13232/element-plus-skills/tree/main/progress
Command: npx skills add https://github.com/wepn13232/element-plus-skills --skill element-plus-progress

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Provides a concise Element Plus Progress component reference so developers can configure percentage, status, and animation options without hunting through scattered docs.

Core Features & Use Cases

  • Attribute Reference: Lists every prop such as percentage, type, color, and duration with defaults and acceptable values for precise bar control.
  • Slot Guidance: Explains how to leverage the default slot for custom content tied to the current percentage data.
  • Reference Link: Directs readers to the official documentation for deeper insights and release updates, ideal for onboarding new Vue UI team members.

Quick Start

Ask how to set el-progress to a striped dashboard style with custom label formatting.

Frequently Asked Questions about element-plus-progress

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

FAQPage Schema
How do I configure the el-progress percentage and type attributes in Vue?▼

To configure the el-progress component, you set the percentage attribute to define the current value and the type attribute to switch between line, circle, and dashboard visual styles in your Vue template.

What properties control the el-progress bar color and animation duration?▼

The el-progress bar color and animation duration are controlled by the color and duration attributes, which accept custom values to override default styling and define the transition speed for percentage updates.

How do I use the default slot in el-progress to display custom content?▼

You leverage the el-progress default slot to inject custom content into the component, allowing you to display tailored text or icons that dynamically reflect the current percentage data.

Does Element Plus support a striped dashboard style for the progress component?▼

Element Plus supports dashboard styles for the progress component by setting the type attribute, and you can apply custom label formatting within the slot to achieve specific visual requirements like striped patterns.

What are the available status values for the Element Plus progress bar?▼

The Element Plus progress bar accepts specific status values to indicate different states, allowing developers to visually switch between success, exception, and warning conditions based on the task outcome.

Related Skills

Explore More Software Engineering Skills→
wepn13232wepn13232
7

element-plus-steps

Explain Element Plus el-steps component attributes, events, and slots.

Community
Basic
montenokimontenoki

d3-viz

Bind data to DOM elements and create interactive visualizations with d3.js.

Community
Advanced
jiaiyanjiaiyan
21

el-progress

Display task progress with Element Plus el-progress component attributes.

Community
Intermediate
ThejanaJayalathThejanaJayalath

ui-to-vue

Convert UI design screenshots into Vue 3 Composition API components.

Community
Intermediate