https://github.com/museui/muse-ui-loading
Muse-UI loading plugin
https://github.com/museui/muse-ui-loading
Last synced: about 1 year ago
JSON representation
Muse-UI loading plugin
- Host: GitHub
- URL: https://github.com/museui/muse-ui-loading
- Owner: museui
- License: mit
- Created: 2018-06-17T07:24:12.000Z (about 8 years ago)
- Default Branch: master
- Last Pushed: 2022-12-09T09:40:16.000Z (over 3 years ago)
- Last Synced: 2025-03-21T03:34:39.790Z (about 1 year ago)
- Language: JavaScript
- Homepage:
- Size: 437 KB
- Stars: 9
- Watchers: 2
- Forks: 3
- Open Issues: 20
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Muse-UI-Loading
Muse-UI plugin loading
## Installation
```bash
npm install -S muse-ui-loading
// or
yarn add muse-ui-loading
```
## CDN
```html
```
## Usage
```javascript
import 'muse-ui-loading/dist/muse-ui-loading.css'; // load css
import Vue from 'vue';
import MuseUILoading from 'muse-ui-loading';
Vue.use(MuseUILoading);
new Vue({
methods: {
loading () {
const loading = this.$loading({
// ...options
});
setTimeout(() => {
loading.close();
}, 3000)
}
}
});
// or
const loading = MuseUILoading({
// ...options
});
setTimeout(() => {
loading.close();
}, 3000)
```
use `v-loading` in element, use `data-mu-loading-*` set option
```html
```
element `position` is can`t `static`;
## API
### config
`Vue.use(MuseUILoading, config)` change default config
```javascript
{
overlayColor: 'hsla(0,0%,100%,.9)', // overlay color
size: 48, // circle progress size
color: 'primary', // color
className: '' // loading class name
}
```
### config (config)
Change default config, Will return new config.
### Loading (options)
Show loading , Will return object ({ instance, close }).
### Options
| Name | Description | Type | Accepted Values | Default |
|------|-------------|------|-----------------|---------|
| overlayColor | overlay color | String | — | hsla(0,0%,100%,.9) |
| color | loading color, loading text color | String | — | primary |
| size | loading size | Number | — | 48 |
| text | loading text | String | — | — |
| className | loading class | String | — | — |
| target | the DOM node Loading needs to cover | Element | — | document.body |
### v-loading
`v-loading="true"`
* data-mu-loading-overlay-color
* data-mu-loading-color
* data-mu-loading-size
* data-mu-loading-text
* data-mu-loading-class
## Dependencies Muse-UI
* `mu-circle-progress`
* `mu-fade-transition`
* muse-ui/lib/internal/mixins/color
* muse-ui/lib/internal/mixins/popup/utils
## Licence
muse-ui is open source and released under the MIT Licence.
Copyright (c) 2018 myron