Vue2-toast-alert NPM

vue2-toast-alert

集弹框，loading，吐司为一体的vue插件

下载

npm i vue2-toast-alert -S
or
cnpm i vue2-toast-alert -S

全局引入

import Toast from 'vue2-toast-alert';
Vue.use(Toast);

使用

1. toast吐司

	this.$toast( msg , options)
	
	this.$toast('您拨打的电话已关机~')
	this.$toast('您拨打的电话已关机~',{duration: 3000 , position:'bottom'})

使用说明

msg 提示语 options 配置选项 -- duration （number）提示时长 | default: 2000 -- position （string）在页面的展示位置 | default:center | 可选项 bottom , top , center

2. loading加载框

	this.$loading();
	this.$hideLoading();

使用说明

loading() 为弹出loading hideLoading() 为关闭loading

3. alert弹框

	this.$alert(msg options)
	
	this.$alert('确定要删除吗')
	this.$alert('确定要删除吗',{showTitle:true, title:'TITLE'})
	this.$alert('确定要删除吗',{sureColor:'#f50'}).then(()=>{ console.log('确定')})
	
	this.$alert('hideAlert') //close alert

 	this.$alert('确定要删除吗',{
    sureColor:'#f50',
    cancelColor:'#000',
    confirm:true ,
    cancelTxt:'no no no',
    sureTxt:'好滴'
	}).then((result)=>{ 
    if(result.cancel){
      console.log('点击取消')
    }
    if( result.confirm){
      console.log('点击确定')
    }
 	})

使用说明

该方法返回一个状态为fullfiled的promise对象 msg 提示语 options 配置选项

showTitle （boolean）是否展示标题 | default: false
title （string）提示框标题文案 | default: 提示
sureTxt （string）确定按钮的文案 | default: 确定
sureColor （string）确定按钮颜色 | default: #007AFF
cancelTxt （string）取消按钮的文案 | default: 取消
cancelColor（boolean）取消按钮颜色 | default: #333333
result （object）点击按钮后调用then的结果 | default: {cancen:false , confirm:false} | 点击取消 cancel为true ，点击确定 confirm为true