From ee20189d6eeecd605abb85990a110c5d93342ecf Mon Sep 17 00:00:00 2001 From: icssoa <615206459@qq.com> Date: Fri, 15 Aug 2025 09:12:04 +0800 Subject: [PATCH] =?UTF-8?q?cl-form-item=20=E6=94=AF=E6=8C=81=E9=85=8D?= =?UTF-8?q?=E7=BD=AE=20rules?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/cl-form-item/cl-form-item.uvue | 24 ++++++++++++++++--- 1 file changed, 21 insertions(+), 3 deletions(-) diff --git a/uni_modules/cool-ui/components/cl-form-item/cl-form-item.uvue b/uni_modules/cool-ui/components/cl-form-item/cl-form-item.uvue index f3ebb5e..1350029 100644 --- a/uni_modules/cool-ui/components/cl-form-item/cl-form-item.uvue +++ b/uni_modules/cool-ui/components/cl-form-item/cl-form-item.uvue @@ -7,6 +7,7 @@ }, pt.className ]" + :id="`cl-form-item-${prop}`" > import { computed, onMounted, onUnmounted, watch, type PropType } from "vue"; import { isEqual, parseClass, parsePt } from "@/cool"; -import type { ClFormLabelPosition, PassThroughProps } from "../../types"; +import type { ClFormLabelPosition, ClFormRule, PassThroughProps } from "../../types"; import { useForm } from "../../hooks"; defineOptions({ @@ -81,6 +82,11 @@ const props = defineProps({ type: String, default: "" }, + // 字段验证规则 + rules: { + type: Array as PropType, + default: () => [] + }, // 标签位置 labelPosition: { type: String as PropType, @@ -109,7 +115,7 @@ const props = defineProps({ }); // cl-form 上下文 -const { formRef, getError, getValue, validateField, addField, removeField } = useForm(); +const { formRef, getError, getValue, validateField, addField, removeField, setRule } = useForm(); // 透传样式类型 type PassThrough = { @@ -165,7 +171,7 @@ watch( computed(() => props.required), (val: boolean) => { if (val) { - addField(props.prop); + addField(props.prop, props.rules); } else { removeField(props.prop); } @@ -176,6 +182,7 @@ watch( ); onMounted(() => { + // 监听字段值变化 watch( computed(() => { const value = getValue(props.prop); @@ -197,6 +204,17 @@ onMounted(() => { deep: true } ); + + // 监听规则变化 + watch( + computed(() => props.rules), + (val: ClFormRule[]) => { + setRule(props.prop, val); + }, + { + deep: true + } + ); }); onUnmounted(() => {