uview-plus 3.3.10 → 3.3.11

package/changelog.md

@@ -1,3 +1,12 @@
+## 3.3.11（2024-08-05）
+feat: 新增支持upload组件的deletable/maxCount/accept变更监听 #333
+
+feat: 新增支持tabs在swiper中使用
+
+feat: 新增FormItem支持独立设置验证规则rules
+
+fix: 修复index-list未设置$slots.header时索引高亮失效
+
 ## 3.3.10（2024-08-02）
 fix: 修复index-list偶发的滑动最后一个索引报错top不存在
 

package/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()

package/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: {

package/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中

package/components/u-index-list/u-index-list.vue

@@ -436,6 +436,13 @@
 			getHeaderRect() {
 				// 获取header slot的高度，因为list组件中获取元素的尺寸是没有top值的
 				return new Promise(resolve => {
+					if (!this.$slots.header) {
+						resolve({
+							width: 0,
+							height: 0
+						})
+					}
+
 					// #ifndef APP-NVUE
 					this.$uGetRect('.u-index-list__header').then(size => {
 						resolve(size)
@@ -454,7 +461,6 @@
 						resolve(res.size)
 					})
 					// #endif
-					
 				})
 			},
 			// scroll-view的滚动事件

package/components/u-tabs/u-tabs.vue

@@ -178,6 +178,7 @@
                 // 获取下划线的数值px表示法
 				const lineWidth = getPx(this.lineWidth);
 				this.lineOffsetLeft = lineOffsetLeft + (tabItem.rect.width - lineWidth) / 2
+				console.log(lineOffsetLeft)
 				// #ifdef APP-NVUE
 				// 第一次移动滑块，无需过渡时间
 				this.animation(this.lineOffsetLeft, this.firstTime ? 0 : parseInt(this.duration))
@@ -257,6 +258,12 @@
 					return
 				}
 				Promise.all([this.getTabsRect(), this.getAllItemRect()]).then(([tabsRect, itemRect = []]) => {
+					// 兼容在swiper组件中使用
+					if (tabsRect.left > tabsRect.width) {
+						tabsRect.right = tabsRect.right - Math.floor(tabsRect.left / tabsRect.width) * tabsRect.width
+						tabsRect.left = tabsRect.left % tabsRect.width
+					}
+					// console.log(tabsRect)
 					this.tabsRect = tabsRect
 					this.scrollViewWidth = 0
 					itemRect.map((item, index) => {

package/components/u-upload/u-upload.vue

@@ -196,6 +196,15 @@
 				immediate: true,
 				deep: true,
 			},
+			deletable(newVal) {
+				this.formatFileList()
+			},
+			maxCount(newVal) {
+				this.formatFileList()
+			},
+			accept(newVal) {
+				this.formatFileList()
+			}
 		},
 		// #ifdef VUE3
 		emits: ['error', 'beforeRead', 'oversize', 'afterRead', 'delete', 'clickPreview'],

package/libs/config/props/formItem.js

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

package/package.json

@@ -2,7 +2,7 @@
 	"id": "uview-plus",
 	"name": "uview-plus",
 	"displayName": "uview-plus3.0重磅发布，全面的Vue3移动组件库。",
-	"version": "3.3.10",
+	"version": "3.3.11",
 	"description": "uview-plus已兼容vue3，全面的组件和便捷的工具会让您信手拈来，如鱼得水",
 	"keywords": [
         "uview",