feat: 新增FormItem支持独立设置验证规则rules

src/pages/componentsA/icon/icon.nvue

@@ -8,7 +8,8 @@
 			    :key="index"
 			>
 				<view class="u-page__grid__item__icon">
-					<up-icon
+					<up-icon
+						stop
 					    :name="item.name"
 					    size="30"
 					    color="#909399"

src/pages/componentsC/form/form.nvue

@@ -51,7 +51,13 @@
 						label="年龄"
 						prop="userInfo.age"
 						borderBottom
-						ref="item1"
+						ref="item1"
+						:rules="[{
+							type: 'string',
+							required: true,
+							message: '请填写年龄',
+							trigger: ['blur', 'change']
+						}]"
 					>
 						<up-input
 							placeholder="请输入内容"
@@ -283,7 +289,7 @@
 						asyncValidator: (rule, value, callback) => {
 							setTimeout(() => {
 								callback('异步规则');
-							}, 3000)
+							}, 1000)
 						},
 						// 触发器可以同时用blur和change，二者之间用英文逗号隔开
 						trigger: ["change", "blur"],

src/uni_modules/uview-plus/components/u-form-item/props.js

@@ -13,9 +13,9 @@ export const props = defineMixin({
             default: () => defProps.formItem.prop
         },
         // 绑定的规则
-        rule: {
-            type: String,
-            default: () => defProps.formItem.rule
+        rules: {
+            type: Array,
+            default: () => defProps.formItem.rules
         },
         // 是否显示表单域的下划线边框
         borderBottom: {

src/uni_modules/uview-plus/components/u-form-item/u-form-item.vue

@@ -87,12 +87,12 @@
 	 * @tutorial https://ijry.github.io/uview-plus/components/form.html
 	 * @property {String}			label			input的label提示语
 	 * @property {String}			prop			绑定的值
-	 * @property {String}			rule			绑定的规则
+	 * @property {Array}			rules			绑定的规则
 	 * @property {String | Boolean}	borderBottom	是否显示表单域的下划线边框
 	 * @property {String | Number}	labelWidth		label的宽度，单位px
 	 * @property {String}			rightIcon		右侧图标
 	 * @property {String}			leftIcon		左侧图标
-	 * @property {String | Object} leftIconStyle 左侧图标的样式
+	 * @property {String | Object} leftIconStyle    左侧图标的样式
 	 * @property {Boolean}			required		是否显示左边的必填星号，只作显示用，具体校验必填的逻辑，请在rules中配置 (默认 false )
 	 *
 	 * @example <u-form-item label="姓名" prop="userInfo.name" borderBottom ref="item1"></u-form-item>
@@ -116,7 +116,8 @@
 					// 错误提示方式
 					errorType: 'message'
 				},
-				color: color
+				color: color,
+				itemRules: []
 			}
 		},
 		// 组件创建完成时，将当前实例保存到u-form中
@@ -129,6 +130,15 @@
 			this.init()
 		},
 		emits: ["click"],
+		watch: {
+			// 监听规则的变化
+			rules: {
+				immediate: true,
+				handler(n) {
+					this.setRules(n);
+				},
+			},
+		},
 		methods: {
 			addStyle,
 			addUnit,
@@ -139,6 +149,12 @@
 					error('u-form-item需要结合u-form组件使用')
 				}
 			},
+			// 手动设置校验的规则，如果规则中有函数的话，微信小程序中会过滤掉，所以只能手动调用设置规则
+			setRules(rules) {
+				// 判断是否有规则
+				if (rules.length === 0) return;
+				this.itemRules = rules;
+			},
 			// 获取父组件的参数
 			updateParentData() {
 				// 此方法写在mixin中

src/uni_modules/uview-plus/components/u-form/u-form.vue

@@ -149,7 +149,12 @@
 								const propertyName =
 									propertyChain[propertyChain.length - 1];
 
-								const rule = this.formRules[child.rule || child.prop];
+								let rule = []
+								if (child.itemRules && child.itemRules.length > 0) {
+									rule = child.itemRules
+								} else {
+									rule = this.formRules[child.prop];
+								}
 								// 如果不存在对应的规则，直接返回，否则校验器会报错
 								if (!rule) {
 									resolve()

src/uni_modules/uview-plus/libs/config/props/formItem.js

@@ -12,7 +12,7 @@ export default {
     formItem: {
         label: '',
         prop: '',
-        rule: '',
+        rules: [],
         borderBottom: '',
         labelPosition: '',
         labelWidth: '',