mint-ui之toast使用(messagebox,indicator同理)
toast为消息提示框,支持自定义位置、持续时间和样式。
一,注意事项
方法1 引入整个 Mint UI 组件,并需要再次单独引入Toast组件
Toast,它并不是一个全局变量,需要先引入 import { Toast } from 'mint-ui' 再使用
Toast('提示信息');
方法2 引入整个 Mint UI 不再单独引入Toast组件
this.$toast('提示信息');
官方文档没写,但看下源码的index.js就找得到
Vue.$messagebox = Vue.prototype.$messagebox = MessageBox;
Vue.$toast = Vue.prototype.$toast = Toast;
Vue.$indicator = Vue.prototype.$indicator = Indicator;
(所有引用插件的源码都在node_modules下面)
二,用法
1.基本用法
Toast('提示信息');
2.多配置用法
position: 'bottom', //提示框位置
duration: 5000 , //持续时间(毫秒),若为 -1 则不会自动关闭
iconClass: 'icon icon-success' , //icon 图标的类名
className:'addClass' //Toast 的类名。可以为其添加样式
});
mint-ui之toast使用(messagebox,indicator同理)的更多相关文章
- Vue移动组件库Mint UI的安装与使用
一.什么是 Mint UI 1.Mint UI 包含丰富的 CSS 和 JS 组件,可以提升移动端开发效率 2.Mint UI 按需加载组件 3.Mint UI 轻量化 二.Mint UI 的安装 1 ...
- 基于VUE.JS的移动端框架Mint UI
Mint UI GitHub:github.com/ElemeFE/mint 项目主页:mint-ui.github.io/# Demo:elemefe.github.io/mint- 文档:mint ...
- vue mint ui 手册文档对于墙的恐惧
http://www.cnblogs.com/smallteeth/p/6901610.html npm 安装 推荐使用 npm 的方式安装,它能更好地和 webpack 打包工具配合使用. npm ...
- vue mint ui 手册文档
npm 安装 推荐使用 npm 的方式安装,它能更好地和 webpack 打包工具配合使用. npm i mint-ui -S CDN 目前可以通过 unpkg.com/mint-ui 获取到最新版本 ...
- Mint UI文档
Mint UI文档:http://elemefe.github.io/mint-ui/#/ 一.Mint UI的安装和基本用法. 1.NPM :npm i mint-ui -S 建议使用npm进行安装 ...
- vue mint UI
vue 与mint UI 结合开发手机app html5页面 api 文档 http://mint-ui.github.io/#!/zh-cn
- 新建一个基于vue.js+Mint UI的项目
上篇文章里面讲到如何新建一个基于vue,js的项目(详细文章请戳用Vue创建一个新的项目). 该项目如果需要组件等都需要自己去写,今天就学习一下如何新建一个基于vue.js+Mint UI的项目,直接 ...
- iView webapp / Mint UI / MUI [前端UI]
前端UI iView webapp一套高质量的 微信小程序 UI 组件库 https://weapp.iviewui.com/?from=iview Mint UI 基于 Vue.js 的移动端组件库 ...
- Mint UI 使用指南
上来直接在webpack里将Mint UI引入项目,发现各种问题.饿了么组件库文档太坑了,好多地方写错,有些该说明的地方没说,比如例子里单文件.vue组件里用的类post-css处理器,我一直使用SA ...
随机推荐
- MySQL数据类型--与MySQL零距离接触 3-2 外键约束的要求解析
列级约束:只针对某一个字段 表级约束:约束针对2个或2个以上的字段 约束类型是按功能来划分. 外键约束:保持数据一致性,完整性.实现数据表的一对一或一对多的关系.这就是把MySQL称为关系型数据库的根 ...
- Makefile中变量定义中末尾不能有空格
我在Makefile中添加了 ifndef EMASSDIR EMASSDIR=$(shell emassTop.py)endif 但是emassTop.py)后面不小心加入了空格,造成出现“Make ...
- php二维数组搜索
$ar = array( 2 => array( 'catid' => 2, 'catdir' => 'notice', ), ...
- cocos2d JS 创建实现换行功能的聊天文本 testLable
-- 创建实现换行功能的文本 function LoadLabelHeroIntroduce(objLabelContent) //传入文本 ---------------------------- ...
- cocos JS for循环让精灵从屏幕中间往两边排列散开
//this.ShowImg[i] 需要排列什么就push加进数组里面,一个for循环计算即可 var size = this.ShowImg.length;var count = size; for ...
- 使用sqlite3解决IDEA中SVN更新提示cleanup却无法cleanup的问题
用idea开发项目,更新svn有时莫名其妙的出现 Error:Error performing cleanup for 'D:\SourceProject\XXXX': svn: E155004: T ...
- JSP中的编码问题
JSP文件的编码 <%@ page contentType="text/html;charset=UTF-8" language="java" %> ...
- anacoda 安装默认源中没有的包
pip install -i https://pypi.tuna.tsinghua.edu.cn/simple 1 安装失败 conda install pygame 2 搜索 anaconda se ...
- 《大话设计模式》c++实现 装饰者模式
一.UML图 介绍 装饰器模式(Decorator Pattern)允许向一个现有的对象添加新的功能,同时又不改变其结构.这种类型的设计模式属于结构型模式,它是作为现有的类的一个包装. 这种模式创 ...
- 《大话设计模式》c++实现 之策略模式
一.UML图 二.概念 策略模式:他定义了算法家族,分别封装起来,让他们之间可以互相替换,此模式让算法的变化,不会影响到使用算法的客户. 三.优点 (1)策略模式是一种定义一系列算法的方法,从 ...