Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs: add loading en doc #1295

Merged
merged 1 commit into from
Apr 21, 2023
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
53 changes: 53 additions & 0 deletions docs/web/api/loading.en-US.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
---
title: Loading
description: Representation of the state when data is being loaded when the network is slow or when there is a lot of data.
isComponent: true
usage: { title: '', description: '' }
spline: message
---

### Icon Loading
Only the icon is displayed during loading. Suitable for loading scenarios where modules are waiting to refresh after opening the page or completing an operation.

{{ base }}

### Text Loading
Text is displayed during loading. Suitable for loading scenarios where modules are waiting to refresh after opening the page or completing an operation.

{{ text }}

### Icon and Text Loading
Text and icons are displayed together during loading. Suitable for loading scenarios where the entire page is waiting to refresh after opening the page or completing an operation.

{{ icon-text }}

### Different Sizes
The small size is suitable for loading scenarios within the component, the medium size is suitable for loading scenarios in container areas such as cards, tables, etc., and the large size is suitable for full-screen loading scenarios on pages.

{{ size }}

### Wrapped Loading
The Loading component can wrap the content that needs to display the loading state.

{{ wrap }}

### Delayed Loading
Set the minimum delay response time, and the loading state will not be displayed for operations with a response time lower than the response time.

{{ delay }}

### Full-screen Loading
The loading state is displayed full-screen, preventing the user from operating.

{{ fullscreen }}

### Attached to a Specific Element
The Loading component can be attached to a specific element using attach.

Note: The element being attached to (the parent element of loading) should set `position: relative;`.

{{ attach }}

### Function Call
{{ service }}