该组件支持以plugin形式调用：
以插件形式调用时，和template中使用不同，属性名请使用小驼峰式，比如isShowMask而不是is-show-mask。
import { ToastPlugin } from 'vux'
Vue.use(ToastPlugin)
// 或者umd方式
// 引入构建的js文件
Vue.use(vuxToastPlugin)
// 默认参数
Vue.use(ToastPlugin, {position: 'top'})
// 显示
this.$vux.toast.show({
text: 'Loading'
})
// 显示文字
this.$vux.toast.text('hello', 'top')
// 隐藏
this.$vux.toast.hide()
// 获取显示状态
this.$vux.toast.isVisible() // v2.9.1 开始支持
API
Variables
Props
| name | type | default | description | required version |
| value | boolean | false | if showing toast, use v-model for binding | -- |
| time | number | 2000 | show time | -- |
| type | string | success | toast type, success, warn, cancel, text | -- |
| width | string | 7.6em | toast's width | -- |
| is-show-mask | boolean | false | if showing mask, users cannot operate other elements on the page | -- |
| text | string | content of the toast, text or html, the same function as default slot | -- | |
| position | string | default | toast position, available values: default, top, middle, bottom | v2.1.1-rc.4 |
Events
| name | params | description | required version |
| @on-show | -- | emits when toast shows | -- |
| @on-hide | -- | emits when toast hides | -- |
Slots
| name | description | required version |
| default | default slot, the content of the toast | -- |
Variables
| name | default | description | inherited name |
| @toast-content-font-size | 16px | text color of content | |
| @toast-top | 180px | default top | |
| @toast-position-top-offset | 10px | position top | |
| @toast-position-bottom-offset | 10px | position bottom | |
| @toast-z-index | 5001 | z-index |
Contributors
Contributors
Total commits quantity: 29，Total contributors quantity: 3
airylandLinHaobinwgChangelog
Releases
- v2.9.1 [feature] add isVisible function for ToastPlugin #2704
- v2.7.7 [fix] plugin options is used as toast default options
- v2.6.3 [fix] fix no padding when using slot and type === text
- v2.5.8 [fix] Toast's zIndex should be higher than XDialog's #1820
- v2.3.1 [feature] Add text method for plugin
- v2.1.1-rc.13 [fix] fix After the call is not set webkitOverflowScrolling for touch
- v2.1.1-rc.10 [fix] Fix warn icon style
- v2.1.1-rc.9 [enhance] Reset props every time plugin.show is called #870 @jsonviewer
- v2.1.1-rc.6 [fix] fix forbidden style being overwritten #1016 @LaiXuechao
- v2.1.1-rc.4 [feature] Support position setting. #973 @ LaiXuechao
- v2.1.1-rc.2 [feature] Add more less variables
- v2.0.0 [change] use `v-model` instead of `:show.sync`
- v2.0.0 [change] do not show mask by default
- v2.0.0 [feature] add prop:isShowMask