vue input 判断

 //输入框 判断

            //全局异常提示信息
            //b 1:失去焦点验证错误提示 2：得到焦点关闭错误提示
            //i 来区分是验证那个input框

            check:function (t,b) {
                var that =this;
                if(b==0){
                    if(t==1){
                        if(that.fNickNames.trim()==""){
                            // console.log("空值")
                            that.error.name="请输入名称"
                            return
                        }else{
                            // console.log("有值了");
                            var reg = /,/g;
                            if(!reg.test(that.fNickNames)){
                                that.error.name="不能有特殊字符，修改过后不能为空 "
                            }
                            if(that.fNickNames.length>8){
                                that.error.name="不能超过八个字"
                            }
                        }
                    }
                }else{
                    if(t==1){
                        // console.log("选中状态")
                        that.error.name=""
                    }
                }
            },

















data定义

//错误弹窗提示
error:{
    name:""
},

<div class="inputall top" :class="error.name==''?'':'border-y'">
                    <span class="input-text">昵称</span>
                    <div class="prompt-y">{{error.name}}</div>
                    <input type="text" v-model="fNickNames" placeholder="花花小六" maxlength="10" @focus="check(1,1)" @blur="check(1,0)"  class="input-mailbox leftboders"/>
                </div>

.border-y {
    height: 41px;
    border: 2px solid #FF6766;
    border-radius: 23px;
    z-index: 2;
    position: relative;
}
.prompt-y {
    min-width: 200px;
    height: 40px;
    background: #fff;
    border-radius: 4px;
    line-height: 40px;
    position: absolute;
    top: -60px;
    left: 20px;
    padding: 0 10px;
    color: #E45050;
    display: none;
}
.prompt-y:after {
    content: "";
    width: 0;
    height: 0;
    border-width: 10px;
    border-style: solid;
    border-color: #fff transparent transparent transparent;
    position: absolute;
    left: 50%;
    top: 39px;
    transform: translate(-50%);
}
.border-y .prompt-y {
    display: block;
}