• vue 中使用 Toast弹框


    import { ToastPlugin,ConfirmPlugin,AlertPlugin} from 'vux'

    Vue.use(ToastPlugin)
    Vue.use(ConfirmPlugin)
    Vue.use(AlertPlugin)
     
    //公用的弹窗(全局变量)
    Vue.prototype.showToast = function( showPositionValue,type,text,width="10em"){
    this.$vux.toast.show({
    showPositionValue: false,
    text: text,
    type: type,
    width,
    position: 'middle'
    })
    }

    //公用alert confirm
    const Message = {};
    Message.install = () => {
    const msg = {
    alert: config => {
    let def = {
    title:'提示',
    content:'系统异常,请重新登录后再试!',
    buttonText:'确定'
    }
    if(typeof config === 'string' || typeof config === 'number'){
    Vue.$vux.alert.show(Object.assign(def,{content:config}));
    }else{
    Vue.$vux.alert.show(Object.assign(def,config));
    }
    },
    confirm: config => {
    let isConfirm = false;
    let def = {
    title:'提示',
    content:'系统异常,请重新登录后再试!',
    confirmText:'确定',
    cancelText:'取消',
    onConfirm:() =>{
    isConfirm = true;
    }
    }
    if(typeof config === 'string' || typeof config === 'number'){
    Vue.$vux.confirm.show(Object.assign(def,{content:config}));
    }else{
    Vue.$vux.confirm.show(Object.assign(def,config));
    }
    /*return new Promise((resolve,reject) => {
    if(isConfirm){
    resolve();
    }
    })*/
    },


    }
    Object.entries(msg).forEach(([method,fn]) => {
    Vue.prototype[method] = fn;
    })
    }
    Vue.use(Message)


    //使用例子
    _this.confirm({
    title:'提示',
    content: '确定要关闭订单',
    onConfirm() {
    console.log('取消订单了');
    }
    });
  • 相关阅读:
    Linux之iptables 防火墙学习
    CentOS下安装JDK7
    分布式日志系统Scribe安装
    Python解析XML
    Python目录操作
    iphone开发-绘图集合 HA
    Mac技巧之显示/隐藏苹果MacOSX系统下隐藏文件的终端命令 HA
    xcode技巧宏定义 HA
    Registering Custom URL Schemes and Handling URL Requests HA
    block about basic HA
  • 原文地址:https://www.cnblogs.com/ch-zaizai/p/7573203.html
Copyright © 2020-2023  润新知