el-loading

Provide consistent loading indicators for Element Plus components with v-loading and ElLoading.service.

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

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Loading states management across views and components can be inconsistent and hard to coordinate. This skill provides a unified approach to show loading indicators with consistent UX.

Core Features & Use Cases

  • Directive usage: attach loading indicators to components with v-loading for component-local feedback.
  • Service usage: control global or cross-component loading through ElLoading.service.
  • Customization: adjust text, spinner, and background to fit your theme.

Quick Start

Attach v-loading to a container to show a loading state and use ElLoading.service for programmatic control.

Frequently Asked Questions about el-loading

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

FAQPage Schema
How do I show a loading indicator in Vue with Element Plus during data fetches?

To show a loading indicator in Vue during data fetches, you can use the v-loading directive on a container component or programmatically control it through ElLoading.service for consistent UI feedback.

What is the best way to manage global loading states across Vue components?

The best way to manage global loading states is using service-based control with ElLoading.service, which allows you to coordinate cross-component loading indicators programmatically rather than relying on local directives.

Can I customize the loading spinner, text, and background in Element Plus?

Yes, you can customize the loading spinner, text, and background in Element Plus. The skill supports API customization to adjust these visual properties so the loading indicator fits your application's theme.

Does v-loading work for component-local UI feedback in Vue?

Yes, v-loading works for component-local UI feedback in Vue. You attach the directive directly to a container element to show a loading state isolated to that specific component's data fetching process.

Why should I use a unified loading directive instead of custom Vue spinners?

A unified loading directive solves the problem of inconsistent loading state management across views. It provides a standardized approach to UI feedback, ensuring coordinated and consistent loading indicators without custom spinner implementations.