2018-06-30 14:52:34 +08:00
|
|
|
---
|
|
|
|
|
title: ActivityIndicator
|
2019-01-29 16:31:24 +08:00
|
|
|
preview: https://didi.github.io/mand-mobile/examples/#/activity-indicator
|
2018-06-30 14:52:34 +08:00
|
|
|
---
|
|
|
|
|
|
2018-12-10 15:41:29 +08:00
|
|
|
Activity indicator, generally used for ongoing tasks
|
2018-06-30 14:52:34 +08:00
|
|
|
|
|
|
|
|
### Import
|
|
|
|
|
|
|
|
|
|
```javascript
|
|
|
|
|
import { ActivityIndicator } from 'mand-mobile'
|
|
|
|
|
|
|
|
|
|
Vue.component(ActivityIndicator.name, ActivityIndicator)
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
### Code Examples
|
|
|
|
|
<!-- DEMO -->
|
|
|
|
|
|
|
|
|
|
### API
|
|
|
|
|
|
|
|
|
|
#### ActivityIndicator Props
|
|
|
|
|
|Props | Description | Type | Default | Note|
|
|
|
|
|
|------|------|------|------|------|
|
|
|
|
|
|type|-|String|`roller`|`roller`, `spinner`, `carousel`|
|
|
|
|
|
|size|icon size|Number|`70px`|unit `px`, or reset `.md-activity-indicator-svg` style directly|
|
2018-09-29 15:31:05 +08:00
|
|
|
|width|icon width|Number|-|unit `px`, only for `roller`|
|
2018-06-30 14:52:34 +08:00
|
|
|
|color|icon color|String|`#fc9153/dark`|`spinner` cannot customize color value, the optional values are `dark` and `light`|
|
|
|
|
|
|text-color|text color|String|`#999`|or reset `.md-activity-indicator-text` style directly|
|
|
|
|
|
|text-size|text font size|String|`70px`|or reset `.md-activity-indicator-text` style directly|
|
|
|
|
|
|vertical|icon and text are arranged vertically|Boolean|`false`|-|
|
