Toast 轻提示层

基础用法

使用content、direction、mask和autoClose属性来定义 Toast 的样式。

  1. this.$toast.text(content, direction, mask, autoClose, callBack)
  2. this.$toast.loading(mask, autoClose, callBack)
  4. methods: {
  5.     toastClick1 () {
  6.       this.$toast.text({
  7.         content: '太长会换行呢，15个字以内最好',
  8.         direction: 'bottom',
  9.         callBack () {
  10.           setTimeout(() => {
  11.             this.$toast.text({content: '关闭后回调操作', direction: 'bottom'})
  12.           }, 2000)
  13.         }
  14.       })
  15.     },
  16.     toastClick2 () {
  17.       this.$toast.loading({
  18.         mask: false
  19.       })
  20.     }
  21. }

属性

参数 说明 类型 可选值 默认值
content 内容 string 自定义 loading无
mask 是否有背景 Boolean - text为false，loading为true
direction 方向 string top,bottom,center text独有，默认center
autoClose 自动关闭 Boolean - 默认为3秒，alert有，confirm无
callBack 回调函数 Function 自定义 -

原文: https://monw3c.github.io/xmui/#/components/toast