uview-plus 3.4.13 → 3.4.15

package/changelog.md

@@ -1,3 +1,16 @@
+## 3.4.15（2025-04-10）
+improvment: 优化移步加载数据时swiper组件displayMultipleItems报错
+
+feat: modal增加contentStyle属性
+
+fix: 修复下拉菜单收起动画缺失
+
+fix: 修复sticky的offset属性值为响应式数据时失效 #237
+
+
+## 3.4.14（2025-04-09）
+feat: 支持自托管内置图标及扩展自定义图标
+
 ## 3.4.13（2025-04-08）
 fix: tabs点击当前tab触发change事件
 

package/components/u-dropdown/u-dropdown.vue

@@ -20,11 +20,12 @@
 			</view>
 		</view>
 		<view class="u-dropdown__content" :style="[contentStyle, {
-			transition: `opacity ${duration / 1000}s linear`,
+			transition: `opacity ${duration / 1000}s, z-index ${duration / 1000}s linear`,
 			top: addUnit(height)
 		}]"
 		 @tap="maskClick" @touchmove.stop.prevent>
-			<view @tap.stop.prevent class="u-dropdown__content__popup" :style="[popupStyle]">
+			<view @tap.stop.prevent class="u-dropdown__content__popup" :style="[popupStyle, {
+			}]">
 				<slot></slot>
 			</view>
 			<view class="u-dropdown__content__mask"></view>
@@ -147,11 +148,11 @@
 				this.active = false;
 				this.current = 99999;
 				// 下拉内容的样式进行调整，不透明度设置为0
-				this.contentStyle = {
-					zIndex: -1,
-					opacity: 0,
-					height: '0px'
-				}
+				this.contentStyle.zIndex = -1;
+				this.contentStyle.opacity = 0;
+				setTimeout(() => {
+					this.contentStyle.height = 0;
+				}, this.duration)
 			},
 			// 点击遮罩
 			maskClick() {

package/components/u-icon/u-icon.vue

@@ -35,24 +35,47 @@
 </template>
 
 <script>
+	import config from '../../libs/config/config';
 	// #ifdef APP-NVUE
 	// nvue通过weex的dom模块引入字体，相关文档地址如下：
 	// https://weex.apache.org/zh/docs/modules/dom.html#addrule
-	const fontUrl = 'https://at.alicdn.com/t/font_2225171_8kdcwk4po24.ttf'
-	const domModule = weex.requireModule('dom')
+	const domModule = weex.requireModule('dom');
 	domModule.addRule('fontFace', {
 		'fontFamily': "uicon-iconfont",
-		'src': `url('${fontUrl}')`
-	})
+		'src': `url('${config.iconUrl}')`
+	});
+	// #endif
+	// #ifdef APP || H5 || MP-WEIXIN || MP-ALIPAY
+	uni.loadFontFace({
+		family: 'uicon-iconfont',
+		source: 'url("' + config.iconUrl + '")',
+		success() {
+			// console.log('内置字体图标加载成功');
+		},
+		fail() {
+			console.error('内置字体图标加载出错');
+		}
+	});
+	if (config.customIcon.family) {
+		uni.loadFontFace({
+			family: config.customIcon.family,
+			source: 'url("' + config.customIcon.url + '")',
+			success() {
+				// console.log('扩展字体图标加载成功');
+			},
+			fail() {
+				console.error('扩展字体图标加载出错');
+			}
+		});
+	}
 	// #endif
 
 	// 引入图标名称，已经对应的unicode
-	import icons from './icons'
+	import icons from './icons';
 	import { props } from './props';
 	import { mpMixin } from '../../libs/mixin/mpMixin';
 	import { mixin } from '../../libs/mixin/mixin';
 	import { addUnit, addStyle } from '../../libs/function/index';
-	import config from '../../libs/config/config';
 	/**
 	 * icon 图标
 	 * @description 基于字体的图标集，包含了大多数常见场景的图标。
@@ -93,7 +116,6 @@
     	},
 		data() {
 			return {
-
 			}
 		},
 		emits: ['click'],
@@ -102,7 +124,7 @@
 			uClasses() {
 				let classes = []
 				classes.push(this.customPrefix + '-' + this.name)
-				// uView的自定义图标类名为u-iconfont
+				// uview-plus内置图标类名为u-iconfont
 				if (this.customPrefix == 'uicon') {
 					classes.push('u-iconfont')
 				} else {
@@ -127,6 +149,9 @@
 					// 某些特殊情况需要设置一个到顶部的距离，才能更好的垂直居中
 					top: addUnit(this.top)
 				}
+				if (this.customPrefix !== 'uicon') {
+					style.fontFamily = this.customPrefix
+				}
 				// 非主题色值时，才当作颜色值
 				if (this.color && !config.type.includes(this.color)) style.color = this.color
 
@@ -147,7 +172,7 @@
 			icon() {
 				// 使用自定义图标的时候页面上会把name属性也展示出来，所以在这里处理一下
 				if (this.customPrefix !== "uicon") {
-					return this.customIcons[this.customPrefix + '-' + this.name] || this.name;
+					return config.customIcons[this.name] || this.name;
 				}
 				// 如果内置的图标中找不到对应的图标，就直接返回name值，因为用户可能传入的是unicode代码
 				return icons['uicon-' + this.name] || this.name
@@ -176,13 +201,12 @@
 	$u-icon-error: $u-error !default;
 	$u-icon-label-line-height:1 !default;
 
-	/* #ifndef APP-NVUE */
-	// 非nvue下加载字体
+	/* #ifdef MP-QQ || MP-TOUTIAO || MP-BAIDU || MP-KUAISHOU || MP-XHS */
+	// 2025/04/09在App/微信/支付宝/鸿蒙元服务已改用uni.loadFontFace加载字体
 	@font-face {
 		font-family: 'uicon-iconfont';
 		src: url('https://at.alicdn.com/t/font_2225171_8kdcwk4po24.ttf') format('truetype');
 	}
-
 	/* #endif */
 
 	.u-icon {

package/components/u-modal/modal.js

@@ -28,6 +28,7 @@ export default {
         confirmButtonShape: '',
         contentTextAlign: 'left',
         asyncCloseTip: '操作中...',
-        asyncCancelClose: false
+        asyncCancelClose: false,
+        contentStyle: {}
     }
 }

package/components/u-modal/props.js

@@ -97,6 +97,11 @@ export const props = defineMixin({
             type: Boolean,
             default: () => defProps.modal.asyncCancelClose
         },
+        // 内容样式
+        contentStyle: {
+            type: Object,
+            default: () => defProps.modal.contentStyle
+        },
         
     }
 })

package/components/u-modal/u-modal.vue

@@ -26,9 +26,7 @@
 			>{{ title }}</view>
 			<view
 				class="u-modal__content"
-				:style="{
-					paddingTop: `${title ? 12 : 25}px`
-				}"
+				:style="contentStyleCpu"
 			>
 				<slot>
 					<text class="u-modal__content__text" :style="{textAlign: contentTextAlign}">
@@ -138,6 +136,13 @@
 			}
 		},
 		emits: ["confirm", "cancel", "close", "update:show", 'cancelOnAsync'],
+		computed: {
+			contentStyleCpu() {
+				let style = this.contentStyle;
+				style.paddingTop = `${title ? 12 : 25}px`
+				return style;
+			}
+		},
 		methods: {
 			addUnit,
 			// 点击确定按钮

package/components/u-picker-data/u-picker-data.vue

@@ -1,7 +1,7 @@
 <template>
 	<view class="u-picker-data">
 		<view class="u-picker-data__trigger">
-			<slot name="trigger"></slot>
+			<slot name="trigger" :current="current"></slot>
 			<up-input
 				v-if="!$slots['trigger']"
 				:modelValue="current"

package/components/u-sticky/u-sticky.vue

@@ -90,6 +90,11 @@
 		mounted() {
 			this.init()
 		},
+		watch: {
+			offsetTop(nval) {
+				this.getStickyTop()
+			}
+		},
 		methods: {
 			init() {
 				this.getStickyTop()

package/components/u-swiper/u-swiper.vue

@@ -30,7 +30,7 @@
 			:previousMargin="addUnit(previousMargin)"
 			:nextMargin="addUnit(nextMargin)"
 			:acceleration="acceleration"
-			:displayMultipleItems="displayMultipleItems"
+			:displayMultipleItems="list.length > 0 ? displayMultipleItems : 0"
 			:easingFunction="easingFunction"
 		>
 			<swiper-item

package/index.js

@@ -17,6 +17,8 @@ import test from './libs/function/test.js'
 import debounce from './libs/function/debounce.js'
 // 节流方法
 import throttle from './libs/function/throttle.js'
+// 浮点计算
+import calc from './libs/function/calc.js'
 // 公共文件写入的方法
 import index from './libs/function/index.js'
 
@@ -36,7 +38,7 @@ import http from './libs/function/http.js'
 
 // 导出
 let themeType = ['primary', 'success', 'error', 'warning', 'info'];
-export { route, http, debounce, throttle, platform, themeType, mixin, mpMixin, props, color, test, zIndex }
+export { route, http, debounce, throttle, calc, platform, themeType, mixin, mpMixin, props, color, test, zIndex }
 export * from './libs/function/index.js'
 export * from './libs/function/colorGradient.js'
 
@@ -69,6 +71,7 @@ const $u = {
     zIndex,
     debounce,
     throttle,
+	calc,
     mixin,
     mpMixin,
     props,

package/libs/config/config.js

@@ -37,6 +37,14 @@ export default {
         'up-tips-color': '#909399',
         'up-light-color': '#c0c4cc'
     },
+    // 字体图标地址
+    iconUrl: 'https://at.alicdn.com/t/font_2225171_8kdcwk4po24.ttf',
+     // 自定义图标
+    customIcon: {
+        family: '',
+        url: ''
+    },
+    customIcons: {}, // 自定义图标与unicode对应关系
 	// 默认单位，可以通过配置为rpx，那么在用于传入组件大小参数为数值时，就默认为rpx
 	unit: 'px',
 	// 拦截器

package/libs/function/calc.js

@@ -0,0 +1,64 @@
+// 浮点数加法
+export function add (arg1, arg2) {
+	var r1, r2, m
+		try {
+			r1 = arg1.toString().split('.')[1].length
+		} catch (e) {
+			r1 = 0
+		}
+		try {
+			r2 = arg2.toString().split('.')[1].length
+		} catch (e) {
+			r2 = 0
+		}
+		m = Math.pow(10, Math.max(r1, r2))
+	return (arg1 * m + arg2 * m) / m
+}
+// 浮点数减法
+export function sub (arg1, arg2) {
+	var r1, r2, m, n
+		try {
+		  r1 = arg1.toString().split('.')[1].length
+		} catch (e) {
+		  r1 = 0
+		}
+		try {
+		  r2 = arg2.toString().split('.')[1].length
+		} catch (e) {
+		  r2 = 0
+		}
+		m = Math.pow(10, Math.max(r1, r2))
+		n = (r1 >= r2) ? r1 : r2
+	return Math.abs(((arg1 * m - arg2 * m) / m).toFixed(n))
+}
+//浮点乘法
+export function mul (a, b) {
+	var c = 0,
+		d = a.toString(),
+		e = b.toString();
+	try {
+		c += d.split(".")[1].length;
+	} catch (f) {}
+	try {
+		c += e.split(".")[1].length;
+	} catch (f) {}
+	return Number(d.replace(".", "")) * Number(e.replace(".", "")) / Math.pow(10, c);
+}
+//浮点除法
+export function div (a, b) {
+	var c, d, e = 0,
+		f = 0;
+	try {
+		e = a.toString().split(".")[1].length;
+	} catch (g) {}
+	try {
+		f = b.toString().split(".")[1].length;
+	} catch (g) {}
+	return c = Number(a.toString().replace(".", "")), d = Number(b.toString().replace(".", "")), xyutil.mul(c / d, Math.pow(10, f - e));
+}
+export default {
+	add,
+	sub,
+	mul,
+	div
+}

package/package.json

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