Package Exports
- vue-toasted
- vue-toasted/dist/vue-toasted.min.js
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (vue-toasted) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
Introduction
vue-toasted is a cool material toast plugin with variety of options and styles. it is touch compatible and responsive. issues and pr's are always welcome
Usage
It is simple. couple of lines all what you need.
# install it via npm
npm install vue-toasted --save// register the plugin on vue
import Toasted from 'vue-toasted';
Vue.use(Toasted)<!-- add this to your root component somewhere -->
<!-- NOTE : you only need to add this once -->
<toasted></toasted>// you can call like this in your component
this.$toasted.show('hello billo')
// and also
Vue.toasted.show('hola billo');All Good Now you have this cool toast in your project.. let's take a look at the api
API
vue-toasted has methods which makes it much easier to use
methods
Vue.toasted.success( {string | html } message, {object} options)
// available methods
Vue.toasted.show(message, options)
Vue.toasted.success(message, options)
Vue.toasted.info(message, options)
Vue.toasted.error(message, options)options
below are the available options
| Option | Description | Values | Default |
|---|---|---|---|
| position | location of the toast | 'top-right', 'top-left', 'bottom-right', 'bottom-left' | 'top-right' |
| duration | display time of the toast | in millisecond | null |
| className | custom css class name of the toast | null | |
| type | style of the toast you prefer | 'primary', 'outline', 'bubble' | 'primary' |
| onComplete | class name of the optional icon font | a callback function | null |
Enjoy Toasting !!