Toast Message Plugin For Vue – m-message

Toast Message Plugin For Vue – m-message

m-message is a small Vue.js plugin to display toast-like info/success/warning/error/loading messages on the applications.

m-message

A message plugin for vue.

Refer to the implementation of ElementUI message component. Style reference ant-message component

中文文档

Live Demo

import Message from 'vue-m-message'

Vue.use(Message) // will mount `Vue.prototype.$message`
Vue.use(Message, {name: 'msg'}) // will mount `Vue.prototype.$msg`

Message API

  • Message(options) Show a message
  • Massage.info(msg|options) Info type message
  • Massage.success(msg|options) Success type message
  • Massage.error(msg|options) Error type message
  • Massage.warning(msg|options) Warning type message
  • Massage.loading(msg|options) Loading type message

options

Attribute Description Type Accepted Values Default
options message options object
options.type message type string 'info', 'success', 'error', 'warning', 'loading' info
options.message message content string ''
options.showClose show close button false/true false
options.onClose close callback function function
options.duration message display duration, unit ms, -1 not closed number 3000
options.zIndex z-index number 1010
options.algin show position string center

Github Repository

Tags: #VueJs