uview-plus 3.8.18 → 3.8.37

package/changelog.md

@@ -1,3 +1,125 @@
+## 3.8.37（2026-05-22）
+feat: 日历组件新增今天按钮并支持快速回到当月
+
+在日历头部增加今天按钮与禁用态，点击后可跳转到今天所在月份；为今天日期增加独立高亮样式且不覆盖用户当前已选日期。同时补充 showToday 配置、类型声明与多语言文案键，保证不同语言和模式下行为一致。
+
+## 3.8.36（2026-05-20）
+fix: 修复 u-parse 链接点击在 iOS 端可能闪退的问题
+
+- 在 u-parse 的两个链接点击入口统一增加 href 规范化与外链判断，避免空值或非法值传入 plus.runtime.openWeb/openURL。
+- 同时将原生外链打开封装为受保护调用并添加异常兜底，降低 APP-PLUS 与 APP-HARMONY 下点击链接导致崩溃的风险。
+
+## 3.8.35（2026-05-19）
+fix: 修复up-input在confirm阶段可能丢失扫码内容
+
+- 问题背景：issue #1011 反馈外接扫码枪场景下，up-input 的 confirm 回调偶发丢码，连续0更明显。
+- 原因分析：组件 onConfirm 直接返回 innerValue，当扫码输入与回车触发节奏接近时，confirm 可能早于最后一次 input 同步，导致取到旧值。
+- 改动说明：onConfirm 优先使用 event.detail.value，若平台未提供该字段再回退到 innerValue，兼容原有行为并降低扫码场景丢码风险。
+## 3.8.34（2026-05-18）
+fix: 仅在 TabBar 页面同步 TabBar 样式
+
+- 在 libs/theme/runtime.js 新增 isTabBarPage 与 trySetTabBarStyle，统一封装 TabBar 页面判断与安全调用。
+- 在 runtime/theme/common mixin 的原生主题同步路径中，全部改为调用 trySetTabBarStyle，不再直接调用 uni.setTabBarStyle。
+
+## 3.8.33（2026-05-17）
+fix: 修复主题变量桥接与 nvue 按钮取色问题
+
+- 调整主题 bridge 的导出位置，避免 legacy light 变量在样式注入后覆盖用户自定义 CSS 变量。
+- 修复 up-button 在 nvue 下的主题取色与 info/plain 样式问题，补充运行时取色兜底，避免按钮颜色错误或主题方法缺失时报错。
+- 同步更新示例接入、版本号与变更记录，保持主题改造后的行为与文档一致。
+
+## 3.8.32（2026-05-14）
+feat: 新增二维码静区配置
+
+- 为 up-qrcode 增加 quietZone 属性，默认值调整为 0。
+- 同步更新二维码绘制逻辑与类型声明，支持按静区宽度控制外层留白。
+
+## 3.8.31（2026-05-14）
+fix: 修复toast组件overlay设置为false时不显示toast的问题 (#1016)
+
+
+## 3.8.30（2026-05-14）
+fix(tooltip): 修复tooltip组件字体大小(size)属性未生效的问题
+
+## 3.8.29（2026-05-13）
+style: 将 Toast 组件硬编码颜色替换为主题变量
+
+- 替换 primary、success、error、warning 类型的背景与边框硬编码颜色
+- 统一接入 $u-{type}-light 与 $u-{type}-disabled 主题变量
+- 增强组件在不同主题下的样式一致性与可维护性
+
+## 3.8.28（2026-05-12）
+style: 优化 up-textarea 组件主题变量与边框样式
+
+- 字数统计区域新增文本颜色主题变量支持
+- 输入框区域重构样式计算，补充背景色、文本色与光标色主题变量
+- 移除原有边框 CSS 类名依赖，改为通过计算属性动态注入边框样式
+- 新增边框颜色计算逻辑，根据亮暗色模式自动适配主题色
+- 修复 H5 端 uni-app 默认包装器样式冲突，统一背景、边框与占位符颜色
+
+## 3.8.27（2026-05-11）
+feat: 新增 nativeThemeSync 配置控制原生UI主题同步
+
+- 在 config 中新增 nativeThemeSync 选项，默认值为 false
+- 在 theme.js 与 runtime.js 的 applyNativeThemeUI 中增加配置拦截，未开启时跳过原生导航栏、页面背景及 tabBar 的样式同步
+- 补充 TypeScript 类型定义，明确默认关闭以避免升级覆盖项目已有的 pages.json 或 theme.json 全局样式
+- 更新验证脚本，增加对该配置开关行为的断言测试
+## 3.8.26（2026-05-11）
+fix: 修复海报组件多行文本截断与省略号渲染问题
+
+- 提取省略号宽度计算与截断逻辑为独立辅助函数，提升代码可维护性
+- 修正达到最大行数时的截断流程，确保末行正确计算宽度并添加省略号
+- 调整换行后当前行字符的赋值时机，避免首字符丢失或渲染状态错乱
+- 补充文件末尾缺失的换行符以符合代码规范
+
+## 3.8.25（2026-05-10）
+fix: 修复H5安装时写入页面背景
+
+- 移除主题初始化时对html、body和#app背景色的内联写入，避免use(uviewPlus)覆盖业务页面背景。
+- 补充运行时主题回归断言，确保H5仍同步data-up-theme但不再改写宿主页面背景样式。
+
+## 3.8.24（2026-05-09）
+fix: 合并 up-slider 组件重复的 mounted 生命周期钩子
+
+- 将原本分散的两个 mounted 钩子合并为单个 async mounted
+- 确保高度/尺寸赋值与滑块 DOM 尺寸获取逻辑在同一钩子内顺序执行
+- 移除底部重复的生命周期代码块，修复因 Vue 钩子执行顺序不确定导致的 init 初始化异常
+
+## 3.8.23（2026-05-09）
+style: 弹窗组件支持主题变量动态设置指示器与关闭图标颜色
+
+- 将底部横条指示器背景色替换为 --up-light-color 主题变量
+- 将关闭图标颜色替换为 --up-content-color 主题变量
+- 新增 indicatorStyle 与 closeIconColor 计算属性实现动态绑定
+- 同步更新 CSS 与内联样式，移除硬编码颜色值以提升多主题适配能力
+
+## 3.8.22（2026-05-08）
+style: 优化 up-input 组件边框样式与主题变量适配
+
+- 移除原有的 u-border 和 u-border-bottom 工具类，改为通过内联样式动态控制边框
+- 新增 inputBorderColor 计算属性，支持通过 --up-input-border-color 主题变量自定义边框颜色
+- 适配深色模式，默认边框颜色根据主题状态自动切换为半透明白色或浅色边框
+- 统一将边框宽度设置为 0.5px，提升多端显示的一致性
+
+## 3.8.21（2026-05-07）
+fix: 修正索引锚点默认背景色识别逻辑
+
+- 扩展默认背景色判断条件，兼容 #f1f1f1 与 #dedede
+- 更新主题变量回退默认值为 #f1f1f1 以匹配新版设计
+
+## 3.8.20（2026-05-06）
+feat: 表单标签颜色支持主题变量动态适配
+
+- 新增 labelDynamicStyle 计算属性，动态读取 --up-main-color 主题变量
+- 将动态样式注入标签元素，实现表单标签颜色随主题配置自动切换
+
+## 3.8.19（2026-04-30）
+feat: 为日期时间选择器遮罩层添加暗色模式自适应样式
+
+- 新增 resolvedMaskStyle 计算属性，优先返回外部传入的 maskStyle
+- 未传入自定义样式且处于暗色主题时，自动注入渐变背景以适配深色模式
+- 替换模板中的遮罩样式绑定，避免硬编码并提升主题切换兼容性
+
 ## 3.8.18（2026-04-29）
 fix: 规避 H5 主题切换时的导航栏 page not found 报错
 

package/components/u-button/u-button.vue

@@ -117,6 +117,7 @@ import { mixin } from '../../libs/mixin/mixin';
 import { props } from "./props";
 import { addStyle } from '../../libs/function/index';
 import { throttle } from '../../libs/function/throttle';
+import { getThemeVar } from '../../libs/theme/runtime.js';
 /**
  * button 按钮
  * @description Button 按钮
@@ -194,8 +195,43 @@ export default {
         isDarkTheme() {
             return this.$u.theme && this.$u.theme.mode === 'dark';
         },
+        nvueMainColor() {
+            return this.resolveNvueColor(this.$u.color.mainColor, this.isDarkTheme ? '#f5f5f5' : '#303133');
+        },
+        nvueBorderColor() {
+            return this.resolveNvueColor(this.$u.color.borderColor, this.isDarkTheme ? '#3a3a3c' : '#dadbde');
+        },
         themeTypeColor() {
-            return this.$u.color[this.type] || this.$u.color.info;
+            const fallbackMap = {
+                primary: '#3c9cff',
+                success: '#5ac725',
+                warning: '#f9ae3d',
+                error: '#f56c6c',
+                info: '#909399',
+            };
+            const type = fallbackMap[this.type] ? this.type : 'info';
+            return this.resolveNvueColor(
+                this.upThemeVar(`--up-${type}`, fallbackMap[type]),
+                fallbackMap[type]
+            );
+        },
+        nvueInfoBackgroundColor() {
+            return this.upThemeVar(
+                '--up-button-info-background-color',
+                this.upThemeVar(
+                    '--up-card-bg-color',
+                    this.isDarkTheme ? '#1c1c1e' : '#ffffff'
+                )
+            );
+        },
+        nvuePlainBackgroundColor() {
+            return this.upThemeVar(
+                '--up-button-plain-background-color',
+                this.upThemeVar(
+                    '--up-card-bg-color',
+                    this.isDarkTheme ? '#1c1c1e' : '#ffffff'
+                )
+            );
         },
         loadingColor() {
             if (this.plain) {
@@ -212,13 +248,11 @@ export default {
         iconColorCom() {
             // 如果是镂空状态，设置了color就用color值，否则使用主题颜色，
             // up-icon的color能接受一个主题颜色的值
-			if (this.iconColor) return this.iconColor;
+            if (this.iconColor) return this.iconColor;
 			if (this.plain) {
                 return this.color ? this.color : this.type;
             } else {
-                return this.type === "info"
-                    ? (this.isDarkTheme ? "#f3f4f6" : "#000000")
-                    : "#ffffff";
+                return this.type === "info" ? this.nvueMainColor : "#ffffff";
             }
         },
         baseColor() {
@@ -249,26 +283,28 @@ export default {
                 }
                 return style;
             }
+            // #ifdef APP-NVUE
             const typeColor = this.themeTypeColor;
             if (this.plain) {
-                style.color = this.type === 'info' ? this.$u.color.mainColor : typeColor;
-                style.backgroundColor = this.isDarkTheme ? '#1c1c1e' : '#ffffff';
-                style.borderColor = this.type === 'info' ? this.$u.color.borderColor : typeColor;
+                style.color = this.type === 'info' ? this.nvueMainColor : typeColor;
+                style.backgroundColor = this.nvuePlainBackgroundColor;
+                style.borderColor = this.type === 'info' ? this.nvueBorderColor : typeColor;
                 style.borderWidth = this.hairline ? '0.5px' : '1px';
                 style.borderStyle = 'solid';
             } else {
                 style.borderWidth = this.hairline ? '0.5px' : '1px';
                 style.borderStyle = 'solid';
                 if (this.type === 'info') {
-                    style.color = this.$u.color.mainColor;
-                    style.backgroundColor = this.isDarkTheme ? '#2c2c2e' : '#ffffff';
-                    style.borderColor = this.$u.color.borderColor;
+                    style.color = this.nvueMainColor;
+                    style.backgroundColor = this.nvueInfoBackgroundColor;
+                    style.borderColor = this.nvueBorderColor;
                 } else {
                     style.color = '#ffffff';
                     style.backgroundColor = typeColor;
                     style.borderColor = typeColor;
                 }
             }
+            // #endif
             return style;
         },
         // nvue版本按钮的字体不会继承父组件的颜色，需要对每一个text组件进行单独的设置
@@ -276,7 +312,7 @@ export default {
             let style = {};
             // 针对自定义了color颜色的情况，镂空状态下，就是用自定义的颜色
             if (this.type === "info") {
-                style.color = this.$u.color.mainColor;
+                style.color = this.nvueMainColor;
             }
             if (this.color) {
                 style.color = this.plain ? this.color : "white";
@@ -301,6 +337,14 @@ export default {
 		'error', 'opensetting', 'launchapp', 'agreeprivacyauthorization'],
     methods: {
         addStyle,
+        resolveNvueColor(colorValue, fallbackColor) {
+            if (typeof colorValue !== 'string') return fallbackColor;
+            if (colorValue.indexOf('var(') > -1) return fallbackColor;
+            return colorValue;
+        },
+        upThemeVar(varName, fallbackColor) {
+            return getThemeVar(varName, fallbackColor, this.$u);
+        },
         clickHandler(e: any) {
             // 非禁止并且非加载中，才能点击
             if (!this.disabled && !this.loading) {
@@ -362,9 +406,9 @@ $u-button-mini-height: 22px !default;
 $u-button-mini-font-size: 10px !default;
 $u-button-mini-min-width: 50px !default;
 $u-button-disabled-opacity: 0.5 !default;
-$u-button-info-color: #323233 !default;
-$u-button-info-background-color: #fff !default;
-$u-button-info-border-color: #ebedf0 !default;
+$u-button-info-color: $u-main-color !default;
+$u-button-info-background-color: var(--up-button-info-background-color, var(--up-card-bg-color, #fff)) !default;
+$u-button-info-border-color: $u-border-color !default;
 $u-button-info-border-width: 1px !default;
 $u-button-info-border-style: solid !default;
 $u-button-success-color: #fff !default;
@@ -397,7 +441,7 @@ $u-button-square-border-top-left-radius: 3px !default;
 $u-button-square-border-bottom-left-radius: 3px !default;
 $u-button-square-border-bottom-right-radius: 3px !default;
 $u-button-icon-min-width: 1em !default;
-$u-button-plain-background-color: #fff !default;
+$u-button-plain-background-color: var(--up-button-plain-background-color, var(--up-card-bg-color, #fff)) !default;
 $u-button-hairline-border-width: 0.5px !default;
 
 .u-button {

package/components/u-calendar/calendar.js

@@ -38,9 +38,10 @@ export default {
         showRangePrompt: true,
         allowSameDay: false,
 		round: 0,
-		monthNum: 3,
-        monthSwitch: false,
-        weekText: [t("up.week.one"), t("up.week.two"), t("up.week.three"), t("up.week.four"), t("up.week.five"), t("up.week.six"), t("up.week.seven")],
+		monthNum: 3,
+        monthSwitch: false,
+        showToday: true,
+        weekText: [t("up.week.one"), t("up.week.two"), t("up.week.three"), t("up.week.four"), t("up.week.five"), t("up.week.six"), t("up.week.seven")],
         forbidDays: [],
         forbidDaysToast: t("up.calendar.disabled"),
         monthFormat: '',

package/components/u-calendar/header.vue

@@ -4,10 +4,10 @@
 			class="u-calendar-header__title"
 			v-if="showTitle"
 		>{{ title }}</text>
-		<view
-			class="u-calendar-header__subtitle-wrap"
-			v-if="showSubtitle"
-		>
+		<view
+			class="u-calendar-header__subtitle-wrap"
+			v-if="showSubtitle"
+		>
 			<text
 				v-if="showSwitch"
 				class="u-calendar-header__switch"
@@ -27,13 +27,19 @@
 				:class="{ 'u-calendar-header__switch--disabled': nextDisabled }"
 				@click="next"
 			>›</text>
-			<text
-				v-if="showSwitch"
-				class="u-calendar-header__switch"
-				:class="{ 'u-calendar-header__switch--disabled': nextYearDisabled }"
-				@click="nextYear"
-			>»</text>
-		</view>
+			<text
+				v-if="showSwitch"
+				class="u-calendar-header__switch"
+				:class="{ 'u-calendar-header__switch--disabled': nextYearDisabled }"
+				@click="nextYear"
+			>»</text>
+			<text
+				v-if="showToday"
+				class="u-calendar-header__today"
+				:class="{ 'u-calendar-header__today--disabled': todayDisabled }"
+				@click="today"
+			>{{ todayText }}</text>
+		</view>
 		<view class="u-calendar-header__weekdays">
 			<text class="u-calendar-header__weekdays__weekday">{{ weekText[0] }}</text>
 			<text class="u-calendar-header__weekdays__weekday">{{ weekText[1] }}</text>
@@ -100,12 +106,27 @@
 				type: Boolean,
 				default: false
 			},
-			// 下一年按钮是否禁用
-			nextYearDisabled: {
-				type: Boolean,
-				default: false
-			}
-		},
+			// 下一年按钮是否禁用
+			nextYearDisabled: {
+				type: Boolean,
+				default: false
+			},
+			// 是否显示今天按钮
+			showToday: {
+				type: Boolean,
+				default: true
+			},
+			// 今天按钮文案
+			todayText: {
+				type: String,
+				default: ''
+			},
+			// 今天按钮是否禁用
+			todayDisabled: {
+				type: Boolean,
+				default: false
+			}
+		},
 		data() {
 			return {
 
@@ -127,13 +148,18 @@
 					this.$emit('prevYear')
 				}
 			},
-			nextYear() {
-				if (!this.nextYearDisabled) {
-					this.$emit('nextYear')
-				}
-			}
-		},
-	}
+			nextYear() {
+				if (!this.nextYearDisabled) {
+					this.$emit('nextYear')
+				}
+			},
+			today() {
+				if (!this.todayDisabled) {
+					this.$emit('today')
+				}
+			}
+		},
+	}
 </script>
 
 <style lang="scss" scoped>
@@ -182,17 +208,33 @@
 			}
 		}
 
-		&__weekdays {
-			@include flex;
-			justify-content: space-between;
+		&__weekdays {
+			@include flex;
+			justify-content: space-between;
 
 			&__weekday {
 				font-size: 13px;
 				color: var(--up-main-color, $u-main-color);
 				line-height: 30px;
 				flex: 1;
-				text-align: center;
-			}
-		}
-	}
-</style>
+				text-align: center;
+			}
+		}
+
+		&__today {
+			margin-left: 4px;
+			height: 28px;
+			line-height: 28px;
+			padding: 0 10px;
+			border-radius: 14px;
+			font-size: 13px;
+			color: var(--up-primary, $u-primary);
+			border: 1px solid var(--up-primary, $u-primary);
+			flex-shrink: 0;
+
+			&--disabled {
+				opacity: 0.35;
+			}
+		}
+	}
+</style>

package/components/u-calendar/month.vue

@@ -135,6 +135,11 @@
 			forbidDaysToast: {
 				type: String,
 				default: ''
+			},
+			// 今天日期，用于独立高亮
+			todayDate: {
+				type: String,
+				default: ''
 			}
 		},
 		data() {
@@ -193,6 +198,10 @@
 					if (this.selected.some(item => this.dateSame(item, date))) {
 						style.backgroundColor = this.color
 					}
+					if (this.todayDate && this.dateSame(date, this.todayDate) && !this.selected.some(item => this.dateSame(item, date))) {
+						style.border = `1px solid ${this.color}`
+						style.boxSizing = 'border-box'
+					}
 					if (this.mode === 'single') {
 						if (date === this.selected[0]) {
 							// 因为需要对nvue的兼容，只能这么写，无法缩写，也无法通过类名控制等等

package/components/u-calendar/props.js

@@ -148,6 +148,11 @@ export const props = defineMixin({
 			type: Boolean,
 			default: () => defProps.calendar.monthSwitch
 		},
+		// 是否显示今天按钮
+		showToday: {
+			type: Boolean,
+			default: () => defProps.calendar.showToday
+		},
         // 星期文案
         weekText: {
 			type: Array,

package/components/u-calendar/u-calendar.vue

@@ -16,6 +16,9 @@
 				:showTitle="showTitle"
 				:weekText="weekText"
 				:showSwitch="monthSwitch"
+				:showToday="showToday"
+				:todayText="todayText"
+				:todayDisabled="todayDisabled"
 				:prevDisabled="switchPrevDisabled"
 				:nextDisabled="switchNextDisabled"
 				:prevYearDisabled="switchPrevYearDisabled"
@@ -24,6 +27,7 @@
 				@next="nextMonth"
 				@prevYear="prevYear"
 				@nextYear="nextYear"
+				@today="jumpToToday"
 			></uHeader>
 			<scroll-view
 				v-if="!monthSwitch"
@@ -56,6 +60,7 @@
 					:forbidDays="forbidDays"
 					:forbidDaysToast="forbidDaysToast"
 					:monthFormat="monthFormat"
+					:todayDate="todayDate"
 					ref="month"
 					@monthSelected="monthSelected"
 					@updateMonthTop="onUpdateMonthTop"
@@ -88,6 +93,7 @@
 					:forbidDays="forbidDays"
 					:forbidDaysToast="forbidDaysToast"
 					:monthFormat="monthFormat"
+					:todayDate="todayDate"
 					ref="month"
 					@monthSelected="monthSelected"
 					@updateMonthTop="onUpdateMonthTop"
@@ -121,6 +127,7 @@ import { mpMixin } from '../../libs/mixin/mpMixin.js'
 import { mixin } from '../../libs/mixin/mixin.js'
 import { addUnit, getPx, range, error, padZero } from '../../libs/function/index';
 import test from '../../libs/function/test';
+import { t } from '../../libs/i18n'
 /**
  * Calendar 日历
  * @description  此组件用于单个选择日期，范围选择日期等，日历被包裹在底部弹起的容器中.
@@ -224,6 +231,28 @@ export default {
 				? Number(this.minDate)
 				: this.minDate
 		},
+		todayDate() {
+			return dayjs().format('YYYY-MM-DD')
+		},
+		todayText() {
+			return t('up.calendar.today')
+		},
+		todayDisabled() {
+			const today = dayjs(this.todayDate)
+			const minDate = this.innerMinDate
+				? dayjs(this.innerMinDate)
+				: null
+			const maxDate = this.innerMaxDate
+				? dayjs(this.innerMaxDate)
+				: null
+			if (minDate && today.isBefore(minDate, 'day')) {
+				return true
+			}
+			if (maxDate && today.isAfter(maxDate, 'day')) {
+				return true
+			}
+			return false
+		},
 		// 多个条件的变化，会引起选中日期的变化，这里统一管理监听
 		selectedChange() {
 			return [this.innerMinDate, this.innerMaxDate, this.defaultDate]
@@ -449,6 +478,22 @@ export default {
 				this.monthIndex += 12
 			}
 		},
+		jumpToToday() {
+			if (this.todayDisabled) {
+				return
+			}
+			const targetMonth = dayjs(this.todayDate).format('YYYY-MM')
+			if (this.monthSwitch) {
+				const todayMonthIndex = this.months.findIndex(({ year, month }) => {
+					return `${year}-${padZero(month)}` === targetMonth
+				})
+				if (todayMonthIndex !== -1) {
+					this.monthIndex = todayMonthIndex
+				}
+				return
+			}
+			this.scrollIntoDefaultMonth(targetMonth)
+		},
 		// 滚动到默认设置的月份
 		scrollIntoDefaultMonth(selected) {
 			// 查询默认日期在可选列表的下标
@@ -462,6 +507,7 @@ export default {
 			if (_index !== -1) {
 				// #ifndef MP-WEIXIN
 				this.$nextTick(() => {
+					this.scrollIntoView = ''
 					this.scrollIntoView = `month-${_index}`
 					this.scrollIntoViewScroll = this.scrollIntoView
 				})