Skip to content

Toast

Silent message notification, Unlike Message, Toast is only displayed in the corner area of ​​the screen

Examples

Message types

Placement

UI customization

API

ts
type MessageContent = string | VNode

function DialogToast(
  message?: MessageContent,
  callback?: Function,
  options?: ToastOptions
): Function

The setting options ToastOptions details

ts
interface ToastOptions {
  /**
   * Plugin language
   * @default `en`
   */
  language?: string
  /**
   * Custom class name
   */
  customClass?: string
  /**
   * Message types
   * @default `info`
   */
  messageType?: 'info' | 'warning' | 'error' |'success'
  /**
   * Message type icon
   * @default true
   */
  icon?: boolean
  /**
   * Display close button
   * @default false
   */
  closeButton?: boolean
  /**
   * The number of milliseconds to automatically close the dialog
   *
   * set to 0 to disable auto close
   *
   * @default 3000
   */
  duration?: number
  /**
   * The distance to the top of viewport
   * @default 16
   */
  offset?: string | number
  /**
   * The placement of the toast dialog
   * @default `top-right`
   */
  placement?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right'
}

Released under the MIT License.