vue-promise-btn
v2.1.0
Published
Vue.js plugin that handles buttons asynchronous lock and show loading state indicator
Downloads
908
Maintainers
Readme
vue-promise-btn
Example and Documentation
https://STUkh.github.io/vue-promise-btn/
Features
- Easy-to-use API
- Flexible Usage
- Works with any tag and even forms
- In Extended Mode - compatible with 3rd party components
- Packaged with optional built-in spinner
- Only 1.5KB minified and gzipped
- ESM, CommonJS, UMD versions
Installation
npm install --save vue-promise-btn
Quick Start:
- Import and "handshake" plugin with vue
import Vue from 'vue'
import VuePromiseBtn from 'vue-promise-btn'
// not required. Styles for built-in spinner
import 'vue-promise-btn/dist/vue-promise-btn.css'
Vue.use(VuePromiseBtn) // or with global options Vue.use(VuePromiseBtn, {})
- Simple usage:
<button v-promise-btn @click="getData">Get Data</button>
- Extended usage:
<button v-promise-btn={ promise: dataPromise } @click="getData('param')">Get Data</button>
If you face any issue with simple mode, just try out extended, it's more reliable way.
Change log
Please see CHANGELOG for more information what has changed recently.
Important Notice
Always return Promise from expression. Especially in simple mode.
Don't use semicolon in event expressions. It may break promise return in template-compiler:
Good: @click="handler($event)"
Bad: @click="handler($event);"
Contributing
Please see CONTRIBUTING and CODE_OF_CONDUCT for details.
Credits
License
The MIT License (MIT). Please see License File for more information.