齐海华
齐海华
  • 发布:2021-10-14 15:51
  • 更新:2022-01-17 15:45
  • 阅读:797

#插件讨论# 【 uni-forms 表单 - DCloud前端团队 】form 的rules不生效。

分类:uni-app
关联插件: uni-forms 表单

使用了官方的例子,填写了rules然后点击提交时不触发校验,然后页面样式设置了必填的也不能显示红色的星星。

<template>  
    <view class="custom-filed-page">  
        <uni-forms :modelValue="formData" ref="form" :rules="rules">  
            <uni-forms-item v-for="(item, index) in customerFields" :key="index" :label="item.title" :name="item.name">  
                <uni-easyinput  
                    v-if="item.content_type == 'text'"  
                    type="text"  
                    v-model="formData[item.name]"  
                    placeholder="请输入"  
                    :disabled="canChange"  
                    placeholderStyle="color:rgba(0, 0, 0, 0.45)"  
                />  
             <view v-else-if="item.content_type == 'verify'">  
                    <uni-easyinput type="text" v-model="formData[item.name]" placeholder="请输入" :disabled="canChange" placeholderStyle="color:rgba(0, 0, 0, 0.45)" />  
                    <view style="position:relative;" @click="getVerifyCode">  
                        <image style="width:160rpx;height:70rpx;position:absolute;right:0rpx;bottom:0rpx;text-align: center;z-index:9999;" :src="validCodeUrl" />  
                    </view>  
                </view>  
                    <view v-else-if="item.content_type == 'radio'"></view>  
                <view v-else-if="item.content_type == 'area_text'"></view>  
                <uni-easyinput  
                    v-else-if="item.content_type == 'link'"  
                    type="text"  
                    v-model="formData[item.name]"  
                    placeholder="请输入"  
                    :disabled="canChange"  
                    placeholderStyle="color:rgba(0, 0, 0, 0.45)"  
                />  
                <view v-else-if="item.content_type == 'droplist'"></view>  
                <view v-else-if="item.content_type == 'date'"></view>  
                <view v-else-if="item.content_type == 'time'"></view>  
                <view v-else-if="item.content_type == 'datetime'"></view>  
                <view v-else-if="item.content_type == 'number'"></view>  
                <view v-else-if="item.content_type == 'numeric'"></view>  
                <view v-else-if="item.content_type == 'checkbox'"></view>  
                <view v-else-if="item.content_type == 'chained_droplist'"></view>  
                <view v-else-if="item.content_type == 'calculate'"></view>  
            </uni-forms-item>  
        </uni-forms>  
        <button v-if="!canChange" class="weui-btn" type="primary" @click="submitForm">确定</button>  
    </view>  
</template>  
{  
    "nick_name": {  
        "rules": [  
            {  
                "required": true,  
                "errorMessage": "姓名是必选项"  
            }  
        ]  
    },  
    "email": {  
        "rules": [  
            {  
                "required": true,  
                "errorMessage": "邮箱是必选项"  
            }  
        ]  
    },  
    "cellphone": {  
        "rules": [  
            {  
                "required": true,  
                "errorMessage": "手机号是必选项"  
            }  
        ]  
    },  
    "validateCode": {  
        "rules": [  
            {  
                "required": true,  
                "errorMessage": "验证码是必选项"  
            }  
        ]  
    }  
}
2021-10-14 15:51 负责人:无 分享
已邀请:
DCloud_UNI_HT

DCloud_UNI_HT

customerFields 怎么定义的

该问题目前已经被锁定, 无法添加新回复