美文网首页
解决mint-ui中Toast重复弹出问题

解决mint-ui中Toast重复弹出问题

作者: muroujue | 来源:发表于2018-05-21 17:08 被阅读0次

比如在watch中监听data的值,超出范围会Toast提示错误信息,一旦输入不符合规则,会重复弹出Toast提示框,效果不好。
可以对Toast进行封装处理一下,弹出Toast时,先关闭其他Toast。

<template>
    <input v-model="price" type="number">
</template>

data() {
    return {
        toastObj:null
    }
},
methods : {
    if (this.toastObj) this.toastObj.close()
    this.toastObj = Toast(msg)
},
watch : {
    'price'(newval){
        if (newval === '') {
            this.ToastMsg('金额不可为空')
        } else if (newval > 50) {
            this.price = 50
            this.ToastMsg('最大额度为50万')
        }
    }
}

相关文章

网友评论

      本文标题:解决mint-ui中Toast重复弹出问题

      本文链接:https://www.haomeiwen.com/subject/bwkqjftx.html