uview-pro 0.5.6 → 0.5.8

package/changelog.md

@@ -1,13 +1,58 @@
-## 0.5.6（2026-02-04）
+## 0.5.8（2026-02-10）
+
+### 🚀 Chore | 构建/工程依赖/工具
+
+- **deps:** 更新 uni-app 相关依赖包版本到 4.87，修复更新包后运行到 h5 报错问题 ([b00751b](https://github.com/anyup/uView-Pro/commit/b00751b2643bd582f2d1b9472e245d856352d4ed))
+
+### 📝 Documentation | 文档
+
+- 添加npm下载量统计徽章 ([63971ee](https://github.com/anyup/uView-Pro/commit/63971eead3365d5efe29166b2252e58904c0306c))
 
 ### 🐛 Bug Fixes | Bug 修复
 
-- **vue-tsc:** 修复部分定时器ts类型定义错误问题（#124） ([dada764](https://github.com/anyup/uView-Pro/commit/dada764eaa6ea73402e8fa6d96a783ae2a68715a))
+- **useToast:** 修复使用useToast全局提示会触发多次监听的问题（#130） ([ae56413](https://github.com/anyup/uView-Pro/commit/ae564132604d27c3d92de2f6ece5eaae75980aaa))
+- **useModal:** 修复使用useModal全局弹窗会触发多次监听的问题（#130） ([50da10c](https://github.com/anyup/uView-Pro/commit/50da10c7c19d65885244df5c99634775be088824))
+- **u-upload:** 修复u-upload组件中删除确认弹窗的“取消”和“确认”按钮国际化问题（#128） ([e48ab1d](https://github.com/anyup/uView-Pro/commit/e48ab1d23f50c850b1fd85c9b48860bd1d5105b0))
+
+### ✨ Features | 新功能
+
+- **useToast:** 支持使用useToast页面级弹出时，toast可指定页面ID（#130） ([7d09ffe](https://github.com/anyup/uView-Pro/commit/7d09ffe5f8bbee5a3872dfc716dc7ba013f7e1bc))
+- **useModal:** 支持使用useModal页面级弹出时，modal可指定页面ID（#130） ([63af409](https://github.com/anyup/uView-Pro/commit/63af409370f775bac7ceabe98db8b5225491baa8))
+- **u-button:** 添加按钮文本属性支持 ([72fda47](https://github.com/anyup/uView-Pro/commit/72fda47673f1b099f12dcd88ca20570d20d3d5bc))
+- **router:** 添加路由跳转hooks功能 ([cb5a687](https://github.com/anyup/uView-Pro/commit/cb5a687bd7ec8c863d237f69b5cb486e86016398))
+- **demo:** 添加useModal和useToast示例页面 ([f42ca51](https://github.com/anyup/uView-Pro/commit/f42ca51839b1ebd3f02106da0310f4bbbfbb96cf))
 
 ### 👥 Contributors
 
 <a href="https://github.com/anyup"><img src="https://github.com/anyup.png?size=40" width="40" height="40" alt="anyup" title="anyup"/></a> 
 
+## 0.5.7（2026-02-06）
+
+### 🐛 Bug Fixes | Bug 修复
+
+- **u-tabs:** 修复u-tabs的scroll-view在不同平台会显示滚动条的问题，统一各平台的滚动条隐藏逻辑 ([6ba904b](https://github.com/anyup/uView-Pro/commit/6ba904b85fdc5be69ab8b430878e16fa74674c64))
+- **demo:** 修复演示项目在钉钉小程序调用uni.setTabBarItem报错问题（#125） ([fd4ea39](https://github.com/anyup/uView-Pro/commit/fd4ea3987928039e9dcc3a53dc8bea42fce2b685))
+- **u-input,u-field:** 修复输入框绑定值为undefined和null时的显示异常问题 ([4af659f](https://github.com/anyup/uView-Pro/commit/4af659fb365179e3ed7db26a1d8571c327497f7a))
+
+### ✨ Features | 新功能
+
+- **demo-page:** 所有页面支持小程序分享功能 ([a055904](https://github.com/anyup/uView-Pro/commit/a05590443e898ed076d47a04cb8bfc74c2e73da8))
+- **u-card:** u-card添加圆角配置功能并调整默认边框样式 ([e43c939](https://github.com/anyup/uView-Pro/commit/e43c9396a17fe485305e63895a7ea8d6edf1906b))
+
+### 👥 Contributors
+
+<a href="https://github.com/anyup"><img src="https://github.com/anyup.png?size=40" width="40" height="40" alt="anyup" title="anyup"/></a> 
+
+## 0.5.6（2026-02-04）
+
+### 🐛 Bug Fixes | Bug 修复
+
+- **vue-tsc:** 修复部分定时器ts类型定义错误问题（#124） ([dada764](https://github.com/anyup/uView-Pro/commit/dada764eaa6ea73402e8fa6d96a783ae2a68715a))
+
+### 👥 Contributors
+
+<a href="https://github.com/anyup"><img src="https://github.com/anyup.png?size=40" width="40" height="40" alt="anyup" title="anyup"/></a> 
+
 ## 0.5.5（2026-02-02）
 
 ### ✨ Features | 新功能

package/components/u-button/types.ts

@@ -9,6 +9,8 @@ import { baseProps } from '../common/props';
 
 export const ButtonProps = {
     ...baseProps,
+    /** 按钮文本 */
+    text: { type: String, default: '' },
     /** 是否细边框 */
     hairLine: { type: Boolean, default: true },
     /** 按钮的预置样式，default，primary，error，warning，success */

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

@@ -48,7 +48,7 @@
         :hover-class="getHoverClass"
         :loading="loading"
     >
-        <slot></slot>
+        <slot>{{ props.text }}</slot>
         <view
             v-if="ripple"
             class="u-wave-ripple"

package/components/u-card/types.ts

@@ -25,7 +25,7 @@ export const CardProps = {
     /** 副标题字体大小，单位rpx */
     subTitleSize: { type: [Number, String], default: '26' },
     /** 是否显示外部边框，只对full=false时有效(卡片与边框有空隙时) */
-    border: { type: Boolean, default: true },
+    border: { type: Boolean, default: false },
     /** 用于标识点击了第几个 */
     index: { type: [String, Number, Object] as PropType<CardIndex>, default: '' },
     /** 用于隔开上下左右的边距，带单位的写法，如："30rpx 30rpx"，"20rpx 20rpx 30rpx 30rpx" */

package/components/u-field/u-field.vue

@@ -36,7 +36,7 @@
                         v-if="props.type === 'textarea'"
                         class="u-flex-1 u-textarea-class"
                         :style="$u.toStyle(props.fieldStyle)"
-                        :value="String(props.modelValue)"
+                        :value="inputValue"
                         :placeholder="String(props.placeholder)"
                         :placeholderStyle="props.placeholderStyle"
                         :disabled="props.disabled"
@@ -56,7 +56,7 @@
                         class="u-flex-1 u-field__input-wrap"
                         :style="$u.toStyle(props.fieldStyle)"
                         :type="(props.type as any)"
-                        :value="String(props.modelValue)"
+                        :value="inputValue"
                         :password="props.password || props.type === 'password'"
                         :placeholder="String(props.placeholder)"
                         :placeholderStyle="props.placeholderStyle"
@@ -74,7 +74,7 @@
                     <view v-if="props.disabled" class="u-field-disabled-overlay" @tap="fieldClick"></view>
                 </view>
                 <u-icon
-                    v-if="props.clearable && props.modelValue != '' && focused && !props.disabled"
+                    v-if="props.clearable && inputValue !== '' && focused && !props.disabled"
                     :size="props.clearSize"
                     name="close-circle-fill"
                     color="var(--u-light-color)"
@@ -160,44 +160,16 @@ import { $u } from '../..';
  * @example <u-field v-model="mobile" label="手机号" required :error-message="errorMessage"></u-field>
  */
 
-const emit = defineEmits(['update:modelValue', 'focus', 'blur', 'confirm', 'right-icon-click', 'click']);
+const emit = defineEmits(['update:modelValue', 'input', 'focus', 'blur', 'confirm', 'right-icon-click', 'click']);
 
-/**
- * field 输入框
- * @description 借助此组件，可以实现表单的输入， 有"text"和"textarea"类型的，此外，借助uView的picker和actionSheet组件可以快速实现上拉菜单，时间，地区选择等， 为表单解决方案的利器。
- * @property {string} icon label左边的图标，限uView的图标名称
- * @property {string} rightIcon 输入框右边的图标名称，限uView的图标名称（默认false）
- * @property {boolean} required 是否必填，左边显示红色"*"号（默认false）
- * @property {string} label 输入框左边的文字提示
- * @property {boolean} password 是否密码输入方式(用点替换文字)，type为text时有效（默认false）
- * @property {boolean} clearable 是否显示右侧清空内容的图标控件（默认true）
- * @property {number|string} labelWidth label的宽度，单位rpx（默认130）
- * @property {string} labelAlign label的文字对齐方式（默认left）
- * @property {string} inputAlign 输入框内容对齐方式（默认left）
- * @property {string} iconColor 左边通过icon配置的图标的颜色（默认var(--u-content-color)）
- * @property {boolean} autoHeight 是否自动增高输入区域，type为textarea时有效（默认true）
- * @property {string|boolean} errorMessage 显示的错误提示内容，如果为空字符串或者false，则不显示错误信息
- * @property {string} placeholder 输入框的提示文字
- * @property {string} placeholderStyle placeholder的样式(内联样式，字符串)，如"color: var(--u-divider-color)"
- * @property {boolean} focus 是否自动获得焦点（默认false）
- * @property {boolean} fixed 如果type为textarea，且在一个"position:fixed"的区域，需要指明为true（默认false）
- * @property {boolean} disabled 是否不可输入（默认false）
- * @property {number|string} maxlength 最大输入长度，设置为 -1 的时候不限制最大长度（默认140）
- * @property {string} confirmType 设置键盘右下角按钮的文字，仅在type="text"时生效（默认done）
- * @property {string} labelPosition label位置（默认left）
- * @property {Record<string, any>} fieldStyle 自定义输入框的样式，对象形式
- * @property {number|string} clearSize 清除图标的大小，单位rpx（默认30）
- * @property {Record<string, any>} iconStyle 左侧图标样式
- * @property {boolean} borderTop 是否显示field的上边框（默认false）
- * @property {boolean} borderBottom 是否显示field的下边框（默认true）
- * @property {boolean} trim 是否自动去除输入内容首尾空格（默认true）
- * @property {string|number} value 输入框绑定值
- * @property {string} type 输入框类型（text/textarea/password等，默认text）
- */
 const props = defineProps(FieldProps);
 
 const focused = ref(false);
-const itemIndex = ref(0);
+
+const inputValue = computed<string>(() => {
+    if (props.modelValue === undefined || props.modelValue === null) return '';
+    return String(props.modelValue);
+});
 
 const inputWrapStyle = computed(() => {
     const style: Record<string, string> = {};
@@ -253,6 +225,7 @@ function onInput(event: any) {
     // 判断是否去除空格
     if (props.trim) value = $u.trim(value);
     emit('update:modelValue', value);
+    emit('input', value);
 }
 
 function onFocus(event: any) {

package/components/u-input/u-input.vue

@@ -19,7 +19,7 @@
             v-if="type == 'textarea'"
             class="u-input__input u-input__textarea"
             :style="getStyle"
-            :value="String(defaultValue)"
+            :value="inputValue"
             :placeholder="placeholder"
             :placeholderStyle="placeholderStyle"
             :disabled="disabled"
@@ -43,7 +43,7 @@
             class="u-input__input"
             :type="((type == 'password' ? 'text' : type) as any)"
             :style="getStyle"
-            :value="String(defaultValue)"
+            :value="inputValue"
             :password="type == 'password' && !showPassword"
             :placeholder="placeholder"
             :placeholderStyle="placeholderStyle"
@@ -65,7 +65,7 @@
         <view class="u-input__right-icon u-flex">
             <view
                 class="u-input__right-icon__clear u-input__right-icon__item"
-                v-if="clearable && modelValue != '' && !disabled"
+                v-if="clearable && inputValue !== '' && !disabled"
                 @click.stop="onClear"
             >
                 <u-icon size="32" name="close-circle-fill" color="var(--u-light-color)" />
@@ -98,7 +98,7 @@
             }"
             v-if="props.type === 'textarea' && props.count"
         >
-            {{ String(defaultValue).length }}/{{ props.maxlength }}
+            {{ inputValue.length }}/{{ props.maxlength }}
         </text>
     </view>
 </template>
@@ -126,7 +126,6 @@ const emit = defineEmits(['update:modelValue', 'input', 'blur', 'focus', 'confir
 
 const { emitToParent } = useChildren('u-input', 'u-form-item');
 
-const defaultValue = ref(props.modelValue);
 const inputHeight = 70; // input的高度
 const textareaHeight = 100; // textarea的高度
 const validateState = ref(props.validateState); // 当前input的验证状态，用于错误时，边框是否改为红色
@@ -134,11 +133,15 @@ const focused = ref(false); // 当前是否处于获得焦点的状态
 const showPassword = ref(false); // 是否预览密码
 const lastValue = ref(''); // 用于头条小程序，判断@input中，前后的值是否发生了变化
 
+const inputValue = computed<string>(() => {
+    if (props.modelValue === undefined || props.modelValue === null) return '';
+    return String(props.modelValue);
+});
+
 // 监听 value 变化
 watch(
-    () => props.modelValue,
+    () => inputValue.value,
     (nVal, oVal) => {
-        defaultValue.value = nVal;
         // 当值发生变化，且为select类型时(此时input被设置为disabled，不会触发@input事件)，模拟触发@input事件
         if (nVal != oVal && props.type == 'select') handleInput({ detail: { value: nVal } });
     }
@@ -179,8 +182,6 @@ function handleInput(event: any) {
     let value = event.detail.value;
     // 判断是否去除空格
     if (props.trim) value = $u.trim(value);
-    // 当前model 赋值
-    defaultValue.value = value;
     emit('update:modelValue', value);
     emit('input', value);
     // 过一个生命周期再发送事件给u-form-item，否则this.$emit('update:modelValue')更新了父组件的值，但是微信小程序上
@@ -208,7 +209,7 @@ function handleBlur(event: any) {
         focused.value = false;
     }, 100);
     setTimeout(() => {
-        let value = String(defaultValue.value);
+        let value = inputValue.value;
         emit('blur', value);
         // 头条小程序由于自身bug，导致中文下，每按下一个键(尚未完成输入)，都会触发一次@input，导致错误，这里进行判断处理
         // #ifdef MP-TOUTIAO

package/components/u-modal/service.ts

@@ -8,15 +8,34 @@
 import type { ModalProps } from './types';
 
 // 普通（页面级）modal 事件
-export const U_MODAL_EVENT_SHOW = 'uview-pro:u-modal:show';
-export const U_MODAL_EVENT_HIDE = 'uview-pro:u-modal:hide';
-export const U_MODAL_EVENT_CLEAR_LOADING = 'uview-pro:u-modal:clear-loading';
+export const U_MODAL_EVENT_SHOW = 'uview-pro:u-modal:show:';
+export const U_MODAL_EVENT_HIDE = 'uview-pro:u-modal:hide:';
+export const U_MODAL_EVENT_CLEAR_LOADING = 'uview-pro:u-modal:clear-loading:';
 
 // 全局（App 根部）modal 事件，供 useModal() 使用
 export const U_MODAL_GLOBAL_EVENT_SHOW = 'uview-pro:u-modal:global:show';
 export const U_MODAL_GLOBAL_EVENT_HIDE = 'uview-pro:u-modal:global:hide';
 export const U_MODAL_GLOBAL_EVENT_CLEAR_LOADING = 'uview-pro:u-modal:global:clear-loading';
 
+// 根据当前页面获取事件名
+export function getEventWithCurrentPage(event: string, page?: string | boolean) {
+    if (page && typeof page === 'string' && page !== '') {
+        return event + page;
+    }
+    return event + getCurrentPage();
+}
+
+// 获取当前页面路由
+function getCurrentPage() {
+    try {
+        const pages = getCurrentPages();
+        const currentPage = pages[pages.length - 1].route as string;
+        return currentPage || '';
+    } catch (error) {
+        return '';
+    }
+}
+
 /**
  * u-modal 函数式调用载荷类型
  * @description 完整覆盖 u-modal 的所有 props（除 modelValue 外）

package/components/u-modal/types.ts

@@ -122,7 +122,7 @@ export const ModalProps = {
     },
     /** 是否作为页面级 modal（通常放在页面中，给 useModal({ page: true }) 使用） */
     page: {
-        type: Boolean,
+        type: [Boolean, String] as PropType<boolean | string>,
         default: false
     }
 };

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

@@ -26,7 +26,7 @@
                         <slot />
                     </view>
                     <view v-else class="u-model__content__message" :style="$u.toStyle(effectiveConfig.contentStyle)">
-                        {{ effectiveConfig.content }}
+                        <text>{{ effectiveConfig.content }}</text>
                     </view>
                 </view>
                 <view
@@ -89,6 +89,7 @@ import {
     U_MODAL_GLOBAL_EVENT_CLEAR_LOADING,
     U_MODAL_GLOBAL_EVENT_HIDE,
     U_MODAL_GLOBAL_EVENT_SHOW,
+    getEventWithCurrentPage,
     type ModalPayload
 } from './service';
 
@@ -128,12 +129,28 @@ const slots = useSlots();
 
 // 确认按钮是否正在加载中
 const loading = ref(false);
-const isGlobal = computed(() => props.global);
-const isPage = computed(() => props.page);
-const showEvent = computed(() => (isGlobal.value ? U_MODAL_GLOBAL_EVENT_SHOW : isPage.value ? U_MODAL_EVENT_SHOW : ''));
-const hideEvent = computed(() => (isGlobal.value ? U_MODAL_GLOBAL_EVENT_HIDE : isPage.value ? U_MODAL_EVENT_HIDE : ''));
+const isGlobal = computed(() => !!props.global);
+const isPage = computed(() => !!props.page);
+const showEvent = computed(() =>
+    isGlobal.value
+        ? U_MODAL_GLOBAL_EVENT_SHOW
+        : isPage.value
+          ? getEventWithCurrentPage(U_MODAL_EVENT_SHOW, props.page)
+          : ''
+);
+const hideEvent = computed(() =>
+    isGlobal.value
+        ? U_MODAL_GLOBAL_EVENT_HIDE
+        : isPage.value
+          ? getEventWithCurrentPage(U_MODAL_EVENT_HIDE, props.page)
+          : ''
+);
 const clearLoadingEvent = computed(() =>
-    isGlobal.value ? U_MODAL_GLOBAL_EVENT_CLEAR_LOADING : isPage.value ? U_MODAL_EVENT_CLEAR_LOADING : ''
+    isGlobal.value
+        ? U_MODAL_GLOBAL_EVENT_CLEAR_LOADING
+        : isPage.value
+          ? getEventWithCurrentPage(U_MODAL_EVENT_CLEAR_LOADING, props.page)
+          : ''
 );
 
 // 存储用户传入的回调函数
@@ -312,7 +329,12 @@ function resetTempConfig() {
     userOnCancel = null;
 }
 
-onMounted(() => {
+// 开始监听事件
+function startListeners() {
+    // 如果为全局 toast，则先移除所有事件监听，再重新监听
+    if (isGlobal.value) {
+        removeAllListeners();
+    }
     if (showEvent.value) {
         uni?.$on && uni.$on(showEvent.value, onServiceShow);
     }
@@ -322,9 +344,10 @@ onMounted(() => {
     if (clearLoadingEvent.value) {
         uni?.$on && uni.$on(clearLoadingEvent.value, clearLoading);
     }
-});
+}
 
-onBeforeUnmount(() => {
+// 停止监听事件
+function stopListeners() {
     if (showEvent.value) {
         uni?.$off && uni.$off(showEvent.value, onServiceShow);
     }
@@ -334,6 +357,27 @@ onBeforeUnmount(() => {
     if (clearLoadingEvent.value) {
         uni?.$off && uni.$off(clearLoadingEvent.value, clearLoading);
     }
+}
+
+// 移除所有事件监听
+function removeAllListeners() {
+    if (showEvent.value) {
+        uni?.$off && uni.$off(showEvent.value);
+    }
+    if (hideEvent.value) {
+        uni?.$off && uni.$off(hideEvent.value);
+    }
+    if (clearLoadingEvent.value) {
+        uni?.$off && uni.$off(clearLoadingEvent.value);
+    }
+}
+
+onMounted(() => {
+    startListeners();
+});
+
+onBeforeUnmount(() => {
+    stopListeners();
 });
 
 defineExpose({

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

@@ -2,7 +2,13 @@
     <view class="u-tabs" :style="$u.toStyle({ background: bgColor }, customStyle)" :class="customClass">
         <!-- $u.getRect()对组件根节点无效，因为写了.in(this)，故这里获取内层接点尺寸 -->
         <view>
-            <scroll-view scroll-x class="u-scroll-view" :scroll-left="scrollLeft" scroll-with-animation>
+            <scroll-view
+                scroll-x
+                class="u-scroll-view"
+                :scroll-left="scrollLeft"
+                :show-scrollbar="false"
+                scroll-with-animation
+            >
                 <view class="u-scroll-box" :id="id" :class="{ 'u-tabs-scroll-flex': !isScroll }">
                     <view
                         class="u-tab-item u-line-1"
@@ -246,9 +252,7 @@ scroll-view {
     box-sizing: border-box;
 }
 
-/* #ifndef APP-NVUE */
-::-webkit-scrollbar,
-::-webkit-scrollbar,
+// 隐藏滚动条样式，支持App、H5、小程序等平台
 ::-webkit-scrollbar {
     display: none;
     width: 0 !important;
@@ -256,7 +260,6 @@ scroll-view {
     -webkit-appearance: none;
     background: transparent;
 }
-/* #endif */
 
 .u-scroll-box {
     position: relative;
@@ -276,6 +279,13 @@ scroll-view ::v-deep ::-webkit-scrollbar {
 }
 /* #endif */
 
+// App-nvue 平台使用特殊的滚动条隐藏方式
+/* #ifdef APP-NVUE */
+.scroll-view-nvue {
+    -webkit-scrollbar: none;
+}
+/* #endif */
+
 .u-scroll-view {
     width: 100%;
     white-space: nowrap;

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

@@ -4,6 +4,7 @@
             scroll-x
             class="u-scroll-view"
             :scroll-left="scrollLeft"
+            :show-scrollbar="false"
             scroll-with-animation
             :style="{ zIndex: Number(zIndex) + 1 }"
         >
@@ -315,9 +316,6 @@ scroll-view {
     transition-property: background-color, color;
 }
 
-/* #ifndef APP-NVUE */
-::-webkit-scrollbar,
-::-webkit-scrollbar,
 ::-webkit-scrollbar {
     display: none;
     width: 0 !important;
@@ -325,7 +323,6 @@ scroll-view {
     -webkit-appearance: none;
     background: transparent;
 }
-/* #endif */
 
 /* #ifdef H5 */
 // 通过样式穿透，隐藏H5下，scroll-view下的滚动条

package/components/u-toast/service.ts

@@ -8,13 +8,32 @@
 import type { ToastProps } from './types';
 
 // 普通（页面级）toast 事件
-export const U_TOAST_EVENT_SHOW = 'uview-pro:u-toast:show';
-export const U_TOAST_EVENT_HIDE = 'uview-pro:u-toast:hide';
+export const U_TOAST_EVENT_SHOW = 'uview-pro:u-toast:show:';
+export const U_TOAST_EVENT_HIDE = 'uview-pro:u-toast:hide:';
 
 // 全局（App 根部）toast 事件，供 useToast() 使用
 export const U_TOAST_GLOBAL_EVENT_SHOW = 'uview-pro:u-toast:global:show';
 export const U_TOAST_GLOBAL_EVENT_HIDE = 'uview-pro:u-toast:global:hide';
 
+// 根据当前页面获取事件名
+export function getEventWithCurrentPage(event: string, page?: string | boolean) {
+    if (page && typeof page === 'string' && page !== '') {
+        return event + page;
+    }
+    return event + getCurrentPage();
+}
+
+// 获取当前页面路由
+function getCurrentPage() {
+    try {
+        const pages = getCurrentPages();
+        const currentPage = pages[pages.length - 1].route as string;
+        return currentPage || '';
+    } catch (error) {
+        return '';
+    }
+}
+
 export type ToastPayload = Partial<ToastProps> & {
     /** 文案（兼容 toast.show('xxx')） */
     title?: string;

package/components/u-toast/types.ts

@@ -32,7 +32,7 @@ export const ToastProps = {
     /** 是否作为全局根部 toast（通常放在 App.vue 中，给 useToast() 使用） */
     global: { type: Boolean, default: false },
     /** 是否作为页面级 toast（通常放在页面中，给 useToast({ page: true }) 使用） */
-    page: { type: Boolean, default: false },
+    page: { type: [Boolean, String] as PropType<boolean | string>, default: false },
     /** 是否为loading “常驻” */
     loading: { type: Boolean, default: false }
 };

package/components/u-toast/u-toast.vue

@@ -56,6 +56,7 @@ import {
     U_TOAST_EVENT_SHOW,
     U_TOAST_GLOBAL_EVENT_HIDE,
     U_TOAST_GLOBAL_EVENT_SHOW,
+    getEventWithCurrentPage,
     type ToastPayload
 } from './service';
 
@@ -197,31 +198,68 @@ function onServiceHide() {
 }
 
 // 是否为 App 根部的“全局 toast”
-const isGlobal = computed(() => props.global);
+const isGlobal = computed(() => !!props.global);
 // 是否为页面级 toast
-const isPage = computed(() => props.page);
+const isPage = computed(() => !!props.page);
 
 // 显示事件
-const showEvent = computed(() => (isGlobal.value ? U_TOAST_GLOBAL_EVENT_SHOW : isPage.value ? U_TOAST_EVENT_SHOW : ''));
+const showEvent = computed(() =>
+    isGlobal.value
+        ? U_TOAST_GLOBAL_EVENT_SHOW
+        : isPage.value
+          ? getEventWithCurrentPage(U_TOAST_EVENT_SHOW, props.page)
+          : ''
+);
+
 // 隐藏事件
-const hideEvent = computed(() => (isGlobal.value ? U_TOAST_GLOBAL_EVENT_HIDE : isPage.value ? U_TOAST_EVENT_HIDE : ''));
+const hideEvent = computed(() =>
+    isGlobal.value
+        ? U_TOAST_GLOBAL_EVENT_HIDE
+        : isPage.value
+          ? getEventWithCurrentPage(U_TOAST_EVENT_HIDE, props.page)
+          : ''
+);
 
-onMounted(() => {
+// 开始监听事件
+function startListeners() {
+    // 如果为全局 toast，则先移除所有事件监听，再重新监听
+    if (isGlobal.value) {
+        removeAllListeners();
+    }
     if (showEvent.value) {
         uni?.$on && uni.$on(showEvent.value, onServiceShow);
     }
     if (hideEvent.value) {
         uni?.$on && uni.$on(hideEvent.value, onServiceHide);
     }
-});
+}
 
-onBeforeUnmount(() => {
+// 停止监听事件
+function stopListeners() {
     if (showEvent.value) {
         uni?.$off && uni.$off(showEvent.value, onServiceShow);
     }
     if (hideEvent.value) {
         uni?.$off && uni.$off(hideEvent.value, onServiceHide);
     }
+}
+
+// 移除所有事件监听
+function removeAllListeners() {
+    if (showEvent.value) {
+        uni?.$off && uni.$off(showEvent.value);
+    }
+    if (hideEvent.value) {
+        uni?.$off && uni.$off(hideEvent.value);
+    }
+}
+
+onMounted(() => {
+    startListeners();
+});
+
+onBeforeUnmount(() => {
+    stopListeners();
 });
 
 defineExpose<ToastExpose>({

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

@@ -365,6 +365,8 @@ function deleteItem(index: number) {
     uni.showModal({
         title: t('uUpload.modalTitle'),
         content: t('uUpload.deleteConfirm'),
+        cancelText: t('uUpload.modalCancelText'),
+        confirmText: t('uUpload.modalConfirmText'),
         success: async (res: any) => {
             if (res.confirm) {
                 // 先检查是否有定义before-remove移除前钩子

package/libs/hooks/useModal.ts

@@ -5,6 +5,7 @@ import {
     U_MODAL_GLOBAL_EVENT_SHOW,
     U_MODAL_GLOBAL_EVENT_HIDE,
     U_MODAL_GLOBAL_EVENT_CLEAR_LOADING,
+    getEventWithCurrentPage,
     type ModalPayload
 } from '../../components/u-modal/service';
 
@@ -32,8 +33,8 @@ export type UseModal = {
 export type UseModalOptions = {
     /** 是否使用全局根部 <u-modal global /> */
     global?: boolean;
-    /** 是否使用页面级 <u-modal page /> */
-    page?: boolean;
+    /** 是否使用页面级 <u-modal page /> 或某个页面的 <u-modal page="pageId" /> */
+    page?: boolean | string;
 };
 
 function normalize(contentOrOptions: string | UseModalShowOptions): UseModalShowOptions {
@@ -44,18 +45,43 @@ function normalize(contentOrOptions: string | UseModalShowOptions): UseModalShow
     return contentOrOptions || {};
 }
 
+function getPage(optionsOrGlobal: UseModalOptions | boolean): string {
+    if (typeof optionsOrGlobal === 'boolean') {
+        return '';
+    }
+    if (optionsOrGlobal.page && typeof optionsOrGlobal.page === 'string' && optionsOrGlobal.page !== '') {
+        return optionsOrGlobal.page;
+    }
+    return '';
+}
+
 /**
  * Modal 函数式调用
- * @description 需要页面/应用中至少存在一个 <u-modal global /> 或 <u-modal page /> 实例用于承接事件；不影响原调用方式。
- * 支持两种调用方式：应用级 useModal() / useModal({ global: true }) 页面级 useModal({ page: true }) / useModal(false)
+ * @description 需要页面/应用中至少存在一个 <u-modal global /> 或 <u-modal page /> 实例用于承接事件；不影响原 ref 调用方式。
+ *
+ * 支持两种调用方式：
+ * - 应用级 useModal() / useModal(true) / useModal({ global: true })
+ * - 页面级 useModal(false) / useModal({ page: true }) / useModal({ page: 'pageId' }) （pageId 应和页面中 <u-modal page="pageId" /> 的 page 属性一致）
  */
 export function useModal(optionsOrGlobal: UseModalOptions | boolean = true): UseModal {
-    const isGlobal = typeof optionsOrGlobal === 'boolean' ? optionsOrGlobal !== false : optionsOrGlobal.global === true;
-    const isPage = typeof optionsOrGlobal === 'boolean' ? optionsOrGlobal === false : optionsOrGlobal.page === true;
+    const isGlobal = typeof optionsOrGlobal === 'boolean' ? optionsOrGlobal === true : !!optionsOrGlobal.global;
+    const isPage = typeof optionsOrGlobal === 'boolean' ? optionsOrGlobal === false : !!optionsOrGlobal.page;
 
-    const showEvent = isGlobal ? U_MODAL_GLOBAL_EVENT_SHOW : isPage ? U_MODAL_EVENT_SHOW : '';
-    const hideEvent = isGlobal ? U_MODAL_GLOBAL_EVENT_HIDE : isPage ? U_MODAL_EVENT_HIDE : '';
-    const clearLoadingEvent = isGlobal ? U_MODAL_GLOBAL_EVENT_CLEAR_LOADING : isPage ? U_MODAL_EVENT_CLEAR_LOADING : '';
+    const showEvent = isGlobal
+        ? U_MODAL_GLOBAL_EVENT_SHOW
+        : isPage
+          ? getEventWithCurrentPage(U_MODAL_EVENT_SHOW, getPage(optionsOrGlobal))
+          : '';
+    const hideEvent = isGlobal
+        ? U_MODAL_GLOBAL_EVENT_HIDE
+        : isPage
+          ? getEventWithCurrentPage(U_MODAL_EVENT_HIDE, getPage(optionsOrGlobal))
+          : '';
+    const clearLoadingEvent = isGlobal
+        ? U_MODAL_GLOBAL_EVENT_CLEAR_LOADING
+        : isPage
+          ? getEventWithCurrentPage(U_MODAL_EVENT_CLEAR_LOADING, getPage(optionsOrGlobal))
+          : '';
 
     function emitShow(payload: UseModalShowOptions) {
         if (showEvent) {

package/libs/hooks/useRouter.ts

@@ -0,0 +1,173 @@
+/**
+ * 路由跳转 hooks，基于 route.ts 的 Router 类实现
+ * 提供 Vue Composition API 风格的路由跳转方法
+ */
+
+import { ref } from 'vue';
+
+interface RouterConfig {
+    type?: string;
+    url?: string;
+    delta?: number;
+    params?: Record<string, any>;
+    animationType?: string;
+    animationDuration?: number;
+    intercept?: boolean;
+}
+
+declare const uni: any;
+
+const config: RouterConfig = {
+    type: 'navigateTo',
+    url: '',
+    delta: 1,
+    params: {},
+    animationType: 'pop-in',
+    animationDuration: 300,
+    intercept: false
+};
+
+// 响应式配置，支持动态修改
+const configRef = ref({ ...config });
+
+/**
+ * 判断 url 前面是否有 "/"，如果没有则加上
+ */
+const addRootPath = (url: string): string => {
+    return url[0] === '/' ? url : `/${url}`;
+};
+
+/**
+ * 整合路由参数
+ */
+const mixinParam = (url: string, params: Record<string, any>): string => {
+    url = url && addRootPath(url);
+    let query = '';
+    if (/.*\/.*\?.*=.*/.test(url)) {
+        query = uni.$u.queryParams(params, false);
+        return url + '&' + query;
+    } else {
+        query = uni.$u.queryParams(params);
+        return url + query;
+    }
+};
+
+/**
+ * 执行路由跳转
+ */
+const openPage = (cfg: RouterConfig): void => {
+    const { url = '', type = '', delta = 1, animationDuration = 300 } = cfg;
+    if (type === 'navigateTo' || type === 'to') {
+        uni.navigateTo({ url, animationDuration });
+    }
+    if (type === 'redirectTo' || type === 'redirect') {
+        uni.redirectTo({ url });
+    }
+    if (type === 'switchTab' || type === 'tab') {
+        uni.switchTab({ url });
+    }
+    if (type === 'reLaunch' || type === 'launch') {
+        uni.reLaunch({ url });
+    }
+    if (type === 'navigateBack' || type === 'back') {
+        uni.navigateBack({ delta });
+    }
+};
+
+/**
+ * 路由跳转主方法
+ */
+const route = async (options: string | RouterConfig = {}, params: Record<string, any> = {}): Promise<void> => {
+    let mergeConfig: RouterConfig = {};
+
+    if (typeof options === 'string') {
+        mergeConfig.url = mixinParam(options, params);
+        mergeConfig.type = 'navigateTo';
+    } else {
+        mergeConfig = uni.$u.deepMerge(configRef.value, options);
+        mergeConfig.url = mixinParam(options.url || '', options.params || {});
+    }
+
+    if (params.intercept !== undefined) {
+        configRef.value.intercept = params.intercept;
+    }
+
+    mergeConfig.params = params;
+    mergeConfig = uni.$u.deepMerge(configRef.value, mergeConfig);
+
+    if (uni.$u.routeIntercept && typeof uni.$u.routeIntercept === 'function') {
+        const isNext = await new Promise<boolean>(resolve => {
+            uni.$u.routeIntercept(mergeConfig, resolve);
+        });
+        isNext && openPage(mergeConfig);
+    } else {
+        openPage(mergeConfig);
+    }
+};
+
+/**
+ * 跳转到指定页面
+ */
+const to = (url: string, params?: Record<string, any>): Promise<void> => {
+    return route({ url, type: 'navigateTo' }, params || {});
+};
+
+/**
+ * 关闭当前页面，跳转到指定页面
+ */
+const redirect = (url: string, params?: Record<string, any>): Promise<void> => {
+    return route({ url, type: 'redirectTo' }, params || {});
+};
+
+/**
+ * 跳转到 tabBar 页面
+ */
+const tab = (url: string, params?: Record<string, any>): Promise<void> => {
+    return route({ url, type: 'switchTab' }, params || {});
+};
+
+/**
+ * 关闭所有页面，跳转到指定页面
+ */
+const reLaunch = (url: string, params?: Record<string, any>): Promise<void> => {
+    return route({ url, type: 'reLaunch' }, params || {});
+};
+
+/**
+ * 返回上一页
+ */
+const back = (delta: number = 1): Promise<void> => {
+    return route({ type: 'navigateBack', delta });
+};
+
+/**
+ * 设置默认路由配置
+ */
+const setConfig = (newConfig: Partial<RouterConfig>): void => {
+    configRef.value = uni.$u.deepMerge(configRef.value, newConfig);
+};
+
+/**
+ * 获取当前路由配置
+ */
+const getConfig = (): RouterConfig => {
+    return { ...configRef.value };
+};
+
+export function useRouter() {
+    return {
+        // 核心跳转方法
+        route,
+        // 便捷方法
+        to,
+        redirect,
+        tab,
+        reLaunch,
+        back,
+        // 配置方法
+        setConfig,
+        getConfig
+    };
+}
+
+export default useRouter;

package/libs/hooks/useToast.ts

@@ -3,6 +3,7 @@ import {
     U_TOAST_EVENT_SHOW,
     U_TOAST_GLOBAL_EVENT_HIDE,
     U_TOAST_GLOBAL_EVENT_SHOW,
+    getEventWithCurrentPage,
     type ToastPayload
 } from '../../components/u-toast/service';
 import type { ThemeType } from '../../types/global';
@@ -33,8 +34,8 @@ export type UseToast = {
 export type UseToastOptions = {
     /** 是否使用全局根部 <u-toast global />，默认 true；为 false 时走页面级 <u-toast /> */
     global?: boolean;
-    /** 是否使用页面级 <u-toast page /> */
-    page?: boolean;
+    /** 是否使用页面级 <u-toast page /> 或某个页面的 <u-toast page="pageId" /> */
+    page?: boolean | string;
 };
 
 function normalize(titleOrOptions: string | UseToastShowOptions): UseToastShowOptions {
@@ -42,16 +43,37 @@ function normalize(titleOrOptions: string | UseToastShowOptions): UseToastShowOp
     return titleOrOptions || {};
 }
 
+function getPage(optionsOrGlobal: UseToastOptions | boolean): string {
+    if (typeof optionsOrGlobal === 'boolean') {
+        return '';
+    }
+    if (optionsOrGlobal.page && typeof optionsOrGlobal.page === 'string' && optionsOrGlobal.page !== '') {
+        return optionsOrGlobal.page;
+    }
+    return '';
+}
+
 /**
  * Toast 函数式调用
  * @description 需要页面/应用中至少存在一个 <u-toast global /> 或 <u-toast page /> 实例用于承接事件；不影响原 ref 调用方式。
- * 支持两种调用方式：应用级 useToast() / useToast({ global: true }) 页面级 useToast({ page: true }) / useToast(false)
+ *
+ * 支持两种调用方式：
+ * - 应用级 useToast() / useToast(true) / useToast({ global: true })
+ * - 页面级 useToast(false) / useToast({ page: true }) / useToast({ page: 'pageId' }) （pageId 应和页面中 <u-toast page="pageId" /> 的 page 属性一致）
  */
 export function useToast(optionsOrGlobal: UseToastOptions | boolean = true): UseToast {
-    const isGlobal = typeof optionsOrGlobal === 'boolean' ? optionsOrGlobal !== false : optionsOrGlobal.global === true;
-    const isPage = typeof optionsOrGlobal === 'boolean' ? optionsOrGlobal === false : optionsOrGlobal.page === true;
-    const showEvent = isGlobal ? U_TOAST_GLOBAL_EVENT_SHOW : isPage ? U_TOAST_EVENT_SHOW : '';
-    const hideEvent = isGlobal ? U_TOAST_GLOBAL_EVENT_HIDE : isPage ? U_TOAST_EVENT_HIDE : '';
+    const isGlobal = typeof optionsOrGlobal === 'boolean' ? optionsOrGlobal === true : !!optionsOrGlobal.global;
+    const isPage = typeof optionsOrGlobal === 'boolean' ? optionsOrGlobal === false : !!optionsOrGlobal.page;
+    const showEvent = isGlobal
+        ? U_TOAST_GLOBAL_EVENT_SHOW
+        : isPage
+          ? getEventWithCurrentPage(U_TOAST_EVENT_SHOW, getPage(optionsOrGlobal))
+          : '';
+    const hideEvent = isGlobal
+        ? U_TOAST_GLOBAL_EVENT_HIDE
+        : isPage
+          ? getEventWithCurrentPage(U_TOAST_EVENT_HIDE, getPage(optionsOrGlobal))
+          : '';
 
     function emitShow(payload: UseToastShowOptions) {
         if (showEvent) {

package/locale/lang/en-US.ts

@@ -13,6 +13,8 @@ export default {
         reUpload: 'Re-upload',
         uploadFailed: 'Upload failed, please try again',
         modalTitle: 'Notice',
+        modalCancelText: 'Cancel',
+        modalConfirmText: 'Confirm',
         deleteConfirm: 'Are you sure you want to delete this item?',
         terminatedRemove: 'Removal cancelled',
         removeSuccess: 'Removed successfully',

package/locale/lang/zh-CN.ts

@@ -13,6 +13,8 @@ export default {
         reUpload: '重新上传',
         uploadFailed: '上传失败，请重试',
         modalTitle: '提示',
+        modalCancelText: '取消',
+        modalConfirmText: '确定',
         deleteConfirm: '您确定要删除此项吗？',
         terminatedRemove: '已终止移除',
         removeSuccess: '移除成功',

package/package.json

@@ -2,7 +2,7 @@
     "id": "uview-pro",
     "name": "uview-pro",
     "displayName": "【支持鸿蒙】uView Pro｜基于Vue3+TS的高质量UI组件库，支持多主题、暗黑模式、多语言",
-    "version": "0.5.6",
+    "version": "0.5.8",
     "description": "uView Pro是基于Vue3+TS的多平台UI框架，提供80+高质量组件、便捷工具和常用模板，支持多主题、暗黑模式、多语言，支持H5/APP/鸿蒙/小程序多端开发。已在鸿蒙应用商店上架，欢迎体验！",
     "main": "index.ts",
     "module": "index.ts",

package/readme.md

@@ -9,6 +9,7 @@
 [![stars](https://img.shields.io/github/stars/anyup/uView-Pro?style=flat-square&logo=GitHub)](https://github.com/anyup/uView-Pro)
 [![forks](https://img.shields.io/github/forks/anyup/uView-Pro?style=flat-square&logo=GitHub)](https://github.com/anyup/uView-Pro)
 [![issues](https://img.shields.io/github/issues/anyup/uView-Pro?style=flat-square&logo=GitHub)](https://github.com/anyup/uView-Pro/issues)
+[![downloads](https://img.shields.io/npm/dm/uview-pro?logo=npm&link=https%3A%2F%2Fwww.npmjs.com%2Fpackage%2Fuview-pro&style=flat-square)](https://www.npmjs.com/package/uview-pro)
 [![npm version](https://img.shields.io/npm/v/uview-pro)](https://www.npmjs.com/package/uview-pro)
 [![Website](https://img.shields.io/badge/uView%20Pro-docs-blue?style=flat-square)](https://uviewpro.cn)
 [![node version](https://img.shields.io/badge/node-%3E%3D18-green)](https://nodejs.org/)