vant表单验证

**
1. 表单校验
1.1 用 van-form 包住
1.2 在 van-field 上要有 v-model=“变量” 和 绑定rules属性 :rules=“rules变量”

复制代码
复制代码
rules变量:[
    {
    // 是否必填
    required:true,
    message:错误信息,
    trigger:"onBlur/onChange"},
    {
    // 自定义表单校验
    validator: value => {
        // true:验证通过
        // false:验证不通过
        return boolean值
    },message:"错误信息",
    trigger:"onBlur/onChange"
    }
  ]
复制代码
复制代码

**

2. 全局表单验证

**
2.1 在 van-form 中定义ref属性 ref=“xxx”
2.2 在触发对应事件的函数中写入以下代码

this.$refs.xxx.validate().then(()=>{
    // 验证通过
    }).catch(()=>{
    //验证失败
    })

**

## 3. 局部表单验证

**
3.1 在 van-form 中定义ref属性 ref=“xxx”
3.2 在需要验证的项的 van-field上加上 name值 name=“ooo”
3.3 在触发对应事件的函数中写入以下代码

this.$refs.xxx.validate("name的值").then(()=>{
    // 验证通过
    }).catch(()=>{
    //验证失败
    })

**

 

转载:https://www.cnblogs.com/mmzuo-798/p/15135862.html

posted @   蜘蛛流  阅读(1684)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· DeepSeek “源神”启动!「GitHub 热点速览」
· 微软正式发布.NET 10 Preview 1:开启下一代开发框架新篇章
· 我与微信审核的“相爱相杀”看个人小程序副业
· C# 集成 DeepSeek 模型实现 AI 私有化(本地部署与 API 调用教程)
· spring官宣接入deepseek,真的太香了~
点击右上角即可分享
微信分享提示