Awesome
Vuetify Toast
Simple toast service based on Vuetify snackbar component. (~1kB gzip)
for Vuetify version 1.x
Installation
npm install --save vuetify-toast
Demo
Demo: https://pzs.github.io/vuetify-toast
Usage
Bundler (Webpack, Rollup)
import vuetifyToast from 'vuetify-toast'
vuetifyToast.info('This is an info toast');
vuetifyToast.success('The document has been saved.');
vuetifyToast.show({
text: 'Test message',
icon: 'information',
color: 'warning',
timeout: 10000,
dismissible: false
});
Browser
<!-- Include after Vue and Vuetify -->
<!-- Local files -->
<script src="vuetify-toast/dist/vuetify-toast.js"></script>
<!-- Or from CDN -->
<script src="https://unpkg.com/vuetify-toast"></script>
<script>
vuetifyToast.success('Awesome!');
</script>
Documentation
Methods
vuetifyToast.show(options)
vuetifyToast.success(text, [options])
vuetifyToast.error(text, [options])
vuetifyToast.info(text, [options])
vuetifyToast.close()
Options
text
(String) The text to show in the snackbaricon
(String) If you want to use an icon to the left in the snackbarcolor
(String) Color of the snackbar, you can use any valid vuetify class. Default'info'
timeout
(Number) Timeout in milliseconds, default:3000
dismissible
(Boolean) defaulttrue
Default options
You can override the default options at any time:
vuetifyToast.defaultOptions.timeout = 5000;
Development
Build
Bundle the js of to the dist
folder:
npm run build
Publishing
The prepublish
hook will ensure dist files are created before publishing. This
way you don't need to commit them in your repository.
# Bump the version first
# It'll also commit it and create a tag
npm version
# Push the bumped package and tags
git push --follow-tags
# Ship it
npm publish