上面的自定义校验方式为同步校验 ,如果需要异步校验,validateFunction 需要返回一个 Promise ,校验不通过 执行 reject(new Error('错误信息')) 返回对应的错误信息,如果校验通过则直接执行 resolve() 即可,在异步校验方法中,不需要使用 callback 。 <template> <view> <uni-forms :modelValue="formData" ref="for...
查了官方文档发现,在使用 validateFunction 自定义校验规则时候,是不能采用 uni-forms 的 rules 属性来配置校验规则,这时候需要通过ref,在onReady生命周期函数调用组件的setRules方法绑定验证规则 onReady() { console.log('on ready...') this.$refs.myform.setRules(this.rules) },...
所以,根据提示,示例项目如下: 1<template>2<viewclass="bg-white flex flex-direction">3<uni-formsref="form":modelValue="current":rules="rules"validate-trigger="bind"err-show-type="undertext">4<uni-forms-itemname="age"label="年龄"required>56</uni-forms-item>7</uni-forms>8确定9</view>1...
如果是自定义规则校验validateFunction,需要在onReady生命周期中(其他生命周期也可以,具体那些未验证,官方推荐onReady)通过this.$refs.form.setRule方法设置规则 ,而不能直接使用rules属性
<uni-forms-itemv-show="tabIndex === 0" name="code"> </uni-forms-item> <uni-forms-itemv-show="tabIndex === 1" name="password"> </uni-forms-
uniapp form表单validator函数校验 简介:uniapp form表单validator函数校验 尝试了用uniapp的from以及uni-forms发现并不是特别好用,就在插件市场找了一个类似于element-ui的表单验证组件,用法基本上和element-ui一致,使用也比较方便 因为目前是用uni-app做小程序,小程序使用有几个限制,需要注意一下;...
</uni-forms-item> </uni-group> </template> <view> 校验表单 只校验用户名和邮箱项 移除用户名的校验结果 移除全部表单校验结果 重置表单 </view> </uni-forms> </view> </template> export default { data() { return { formData: { name: 'DCloud', age: 21, email: '', sex: '0', ...
通过uni-ui组件库的uni-forms组件实现表单校验。 操作步骤 1. 定义校验规则 2. 修改表单结构 3. 绑定校验规则 4. 提交时校验表单 参考代码 // 定义校验规则 const rules: UniHelper.UniFormsRules = { receiver: { rules: [{ required: true, errorMessage: '请输入收货人姓名' }], }, contact: { rule...
关于uni-app使用uni-forms报 indexOf未定义 在项目中使用uni-forms 时报Error in created hook: "TypeError: Cannot read property 'indexOf' of undefined" , 原因:在项目中,使用uni-forms-item 时没有给name 属性; 而在uni-forms-item.vue 文件中会处理name, 所以加上name属性就可以了...