栏目分类:
子分类:
返回
文库吧用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
文库吧 > IT > 软件开发 > 后端开发 > Java

Vue全局提示(Message)

Java 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

Vue全局提示(Message)

可自定义设置全局提示自动关闭的延时时长,duration默认为3s

整体效果与ant-design全局提示(Message)一致

调用一次只展示一个提示,若调用多次则依次展示多个提示

效果如下图:

info()调用:

success()调用:

error()调用:

warning()调用:

①创建全局提示组件Message:



②在要使用的页面引入:

哥斯拉

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;
}
转载请注明:文章转载自 www.wk8.com.cn
本文地址:https://www.wk8.com.cn/it/1039394.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 wk8.com.cn

ICP备案号:晋ICP备2021003244-6号