vue表单验证问题

用vue做表单验证时遇到个问题,页面刷新时就显示了报错信息,怎么能让他默认不校验
如下图:图片描述

还有设置了两种校验,怎么设置校验信息的优先级,而不是同时出现两个报错信息?

<div class="form-group new-psw-field">
    <label class="form-title" for="new_psw">新密码:</label>
    <input  id="new_psw" v-validate:newpsw="{required: true, maxlength: 18, minlength: 6}" class="form-control" placeholder="请输入新密码"  v-model="newpsw"/>
    <span class="errors">
        <span v-if="$validation1.newpsw.required">密码不能为空!</span>
        <span v-if="$validation1.newpsw.maxlength">密码长度不能大于18位!</span>
        <span v-if="$validation1.newpsw.minlength">密码长度不能小于6位!</span>
    </span>
</div>
阅读 21.5k
3 个回答

解决了 用touched判断元素是否聚焦过

<label class="form-title" for="new_pass">新密码:</label>
<input  id="new_pass" v-validate:new-pass="{required: true, maxlength: 18, minlength: 6}" class="form-control" placeholder="请输入新密码"  v-model="newPass"/>
<div v-if="$validation.newPass.touched" class="errors">
    <div v-if="$validation.newPass.required">密码不能为空!</div>
    <div v-if="!$validation.newPass.required && $validation.newPass.maxlength">密码长度不能大于18位!</div>
    <div v-if="!$validation.newPass.required && $validation.newPass.minlength">密码长度不能小于6位!</div>
</div>

添加initial="off"属性啊

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题