可自定义设置全局提示自动关闭的延时时长,duration默认为3s
整体效果与ant-design全局提示(Message)一致
调用一次只展示一个提示,若调用多次则依次展示多个提示
效果如下图:
info()调用:
success()调用:
error()调用:
warning()调用:
①创建全局提示组件Message:
{{ content }}
②在要使用的页面引入:
哥斯拉import Message from './Message' components: { Message }, onShowMessage (content) { this.$refs.message.info(content) // info调用 // this.$refs.message.success(content) // success调用 // this.$refs.message.error(content) // error调用 // this.$refs.message.warning(content) // warning调用 } .m-tag { margin-top: 120px; display: inline-block; padding: 6px 12px; border-radius: 15px; height: 20px; font-size: 14px; font-weight: 400; line-height: 20px; cursor: pointer; } .yellow { color: #FF9000; background: #FFF9F0; }