zent

Version:

一套前端设计语言和基于React的实现

55 lines (42 loc) • 3.38 kB

Markdown

--- title: Progress path: component/progress group: Feedback scatter: true --- ## Progress Displays the current progress of an operation when it takes a long time to complete. ### Suggestion - It takes a long time to finish - Is running in the background and may take more than 4 seconds - The action needs to show a percentage of completion ### Note - The process time cannot be estimated. `Loading` is recommended. - Actions determined by the process within 4 seconds are not recommended ### Demos        ### API | Property | Description | Type | Default | Alternative | | -------------- | ------------------------------------------------------------------------- | ------- | ----------------- | ------------------------------------------ | | className | The custom classname | string | | | | type | Style of progess | string | `'line'` | `'circle'` | | percent | percentage of progress | number | `0` | | | status | status of progress, has higher priority than percent | string | | `'normal'` \| `'success'` \| `'exception'` | | showInfo | Whether to show status information | boolean | `true` | `false` | | format | The format function of text, only work on normal status | func | built-in function | | | strokeWidth | The width of progess bar, unit: px | number | `10` | | | width | The diameter of the cicrle progress bar or the length of the line progess | number | | | | bgColor | The color of background | string | | | | normalColor | The color in normal state | string | | | | successColor | The color in successful state. | string | | | | exceptionColor | The color in exception state | string | | | | strokeLinecap | Change the linecaps from round to square | string | `'round'` | `'round'` \| `'square'` | #### The following functions is obsolete in the new design system and is only used as a reference for the old version