3***@qq.com
3***@qq.com
  • 发布:2024-04-13 16:13
  • 更新:2025-02-08 17:29
  • 阅读:817

uni-forms的校验数据方法validate()不生效

分类:uni-app
        <uni-forms :model="registerForm" :rules="rules" validateTrigger="bind" ref="registerForm" label-width="90px"  
            border>  
                    <!-- 顶部标题 -->  
                    <view>  
                        <uni-title type="h1" align="center" title="注册"></uni-title>  
                    </view>  

                    <!-- 昵称 -->  
                    <view>  
                        <uni-forms-item label='用户名:' name="userName" required>  
                            <uni-easyinput type="text" v-model="registerForm.userName" placeholder="请输入用户名"  
                                placeholderStyle="font-size: 16px;" />  
                        </uni-forms-item>  
                    </view>  
                        <!-- 提交表单 -->  
                        <button class="btn bg-blue flex-sub" hover-class="bg-gray" @click="validateData">注册</button>  

                    <!-- 密码设置 -->  
                    <view>  
                        <uni-forms-item label="密码:" name="password" required>  
                            <uni-easyinput type="password" v-model="registerForm.password" placeholder="请输入密码"  
                                placeholderStyle="font-size: 16px;" />  
                        </uni-forms-item>  
                    </view>  

                    <!-- 确认密码 -->  
                    <view>  
                        <uni-forms-item label="确认密码:" name="confirmPassword" required>  
                            <uni-easyinput type="password" v-model="registerForm.confirmPassword" placeholder="请确认密码"  
                                placeholder-style="font-size:16px" />  
                        </uni-forms-item>  
                    </view>  
        </uni-forms>

js代码
...
// 点击注册时,校验数据是否符合规范
validateData() {
this.$refs.registerForm.validate().then(res => {
console.log("表单校验成功");
}).catch(err => {
this.$modal.msgError("请填写正确信息");
console.log("表单校验失败:" + JSON.stringify(err));
})
},
问题描述:当我点击注册时,如果数据不符合规范,catch里面的内容是会输出的,但是数据符合规范的话,then里面的内容就不会触发,试了好多遍,还是这样

2024-04-13 16:13 负责人:无 分享
已邀请:
1***@163.com

1***@163.com

uniforms 里有个checkAll方法,

for (let i in childrens) {  
                    const child = childrens[i]  
                    let name = realName(child.name);  
                    const result = await child.onFieldChange(tempFormData[name]);  
                    if (result) {  
                        results.push(result);  
                        // toast ,modal 只需要执行第一次就可以  
                        if (this.errShowType === 'toast' || this.errShowType === 'modal') break;  
                    }  
                }

childrens是数组,for in 会遍历原型链上的属性,执行到await child.onFieldChange会报错。app上校验失效。

  • DCloud_UNI_yuhe

    你好,你的报错内容是什么?可否提供一下一个可以复现的代码

    2025-02-05 10:45

1***@163.com

1***@163.com

错误原因找到了:

  1. uni-forms放入了非uni-forms-item的直接子组件或view
  2. Array.prototype.at为了兼容低版本手机实现at方法,导致for in 遍历了原型链上的方法了。

要回复问题请先登录注册