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