uview-pro 0.3.14 → 0.3.16

package/changelog.md

@@ -1,3 +1,49 @@
+## 0.3.16（2025-11-21）
+
+### 📝 Documentation | 文档
+
+- 更新贡献者信息 ([a6d52dc](https://github.com/anyup/uView-Pro/commit/a6d52dc6db9d56ccdf5c5ad4230e32c716e36241))
+
+### ♻️ Code Refactoring | 代码重构
+
+- **u-waterfall:** 优化瀑布流组件性能和代码结构 ([841c465](https://github.com/anyup/uView-Pro/commit/841c465de4f1a1efc43e05248794b566e0051bd8))
+- **pages:** 重构工具和模板页面，优化i18n国际化功能 ([6cfda7f](https://github.com/anyup/uView-Pro/commit/6cfda7f2ecfd6dd60501201d8797fe702b29df4d))
+- **u-dropdown:** 删除无用的测试代码 ([7c06f1f](https://github.com/anyup/uView-Pro/commit/7c06f1f3f0d1dcd5ae2bbd3420a4124c5faec004))
+
+### 🐛 Bug Fixes | Bug 修复
+
+- **backTop:** 修复回到顶部组件示例无效的问题 ([5a9b736](https://github.com/anyup/uView-Pro/commit/5a9b7366f5916627815488039327669f424dd0ce))
+- **u-text:** 修复 u-text 组件单行省略号显示无效的问题 ([041ee36](https://github.com/anyup/uView-Pro/commit/041ee36fb60d5a082fbdde7e9334ae42b386944c))
+
+### ✨ Features | 新功能
+
+- **u-link:** 添加自定义点击跳转功能 ([8a521f3](https://github.com/anyup/uView-Pro/commit/8a521f36a9f417aa90263cdcf7978ce48d6ed01e))
+- **u-tabs:** 增强 u-tabs 组件，支持隐藏 tab 项的功能配置 ([9a58964](https://github.com/anyup/uView-Pro/commit/9a58964061a7d18510624fb4c6d009568bd3974c))
+
+### 👥 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.3.15（2025-11-14）
+
+### ✨ Features | 新功能
+
+- **u-dropdown:** u-dropdown中的u-dropdown-item中新增控制显示隐藏属性 ([e4ee28f](https://github.com/anyup/uView-Pro/commit/e4ee28fd0a66ceb6bbed07b7969862e936e5e573))
+- **u-form:** 支持嵌套属性验证(a.b.c格式) ([1bbead8](https://github.com/anyup/uView-Pro/commit/1bbead8be764491844a7d3909480a360ff2dc4d4))
+- **form:** 添加表单字段的嵌套校验演示示例 ([73b4abe](https://github.com/anyup/uView-Pro/commit/73b4abe98047ac5193b56b71cdacb05957760e93))
+
+### 🚀 Chore | 构建/工程依赖/工具
+
+- 更新应用 logo 和图标 ([38d52e4](https://github.com/anyup/uView-Pro/commit/38d52e4a9e8656bcae89892a5f94a5201a1af7b2))
+
+### ♻️ Code Refactoring | 代码重构
+
+- 更新 logo 图片地址 ([c0fe3d1](https://github.com/anyup/uView-Pro/commit/c0fe3d15d6f4498229feaba860ff78e43a5297e6))
+
+### 👥 Contributors
+
+<a href="https://github.com/zuo-wentao"><img src="https://github.com/zuo-wentao.png?size=40" width="40" height="40" alt="zuo-wentao" title="zuo-wentao"/></a> <a href="https://github.com/elkelkelkelkelk"><img src="https://github.com/elkelkelkelkelk.png?size=40" width="40" height="40" alt="elkelkelkelkelk" title="elkelkelkelkelk"/></a> <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.3.14（2025-11-14）
 
 ### ✨ Features | 新功能

package/components/u-dropdown/types.ts

@@ -2,11 +2,6 @@ import type { ExtractPropTypes, PropType } from 'vue';
 import { baseProps } from '../common/props';
 import { getColor } from '../../';
 
-try {
-    console.log(getColor('primary'));
-} catch (e) {
-    console.log('get color error');
-}
 /**
  * u-dropdown 下拉菜单 Props
  * @description 该组件一般用于向下展开菜单，同时可切换多个选项卡的场景

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

@@ -149,9 +149,14 @@ onMounted(() => {
 function init() {
     menuList.value = [];
     children.forEach(child => {
+        // 过滤不显示的项
+        const show = child?.getExposed()?.props.show !== false;
+        if (!show) return;
+
         menuList.value.push({
             title: child?.getExposed()?.props.title ?? '',
-            disabled: child?.getExposed()?.props.disabled ?? false
+            disabled: child?.getExposed()?.props.disabled ?? false,
+            childIndex: children.indexOf(child)
         });
     });
 }
@@ -167,8 +172,11 @@ function menuClick(index: number) {
     if (index === current.value && props.closeOnClickSelf) {
         close();
         // 等动画结束后，再移除下拉菜单中的内容，否则直接移除，也就没有下拉菜单收起的效果了
+        const childIndex = menuList.value[index]?.childIndex; //避免访问到show为false的项
         setTimeout(() => {
-            if (children[index]) children[index]?.getExposed()?.setActive(false);
+            if (childIndex !== undefined && children[childIndex]) {
+                children[childIndex]?.getExposed()?.setActive(false);
+            }
         }, Number(props.duration));
         return;
     }
@@ -191,8 +199,9 @@ function open(index: number) {
     current.value = index;
     // 历遍所有的子元素，将索引匹配的项标记为激活状态，因为子元素是通过v-if控制切换的
     // 之所以不是因display: none，是因为nvue没有display这个属性
+    const childIndex = menuList.value[index]?.childIndex; //避免访问到show为false的项
     children.forEach((child, idx) => {
-        child?.getExposed()?.setActive(index == idx ? true : false);
+        child?.getExposed()?.setActive(childIndex === idx ? true : false);
     });
     emit('open', current.value);
 }

package/components/u-dropdown-item/types.ts

@@ -10,6 +10,7 @@ import { baseProps } from '../common/props';
  * @property {OptionType[]} options 选项数据，如果传入了默认slot，此参数无效
  * @property {Boolean} disabled 是否禁用此选项卡（默认false）
  * @property {String|Number} height 弹窗下拉内容的高度(内容超出将会滚动)（默认auto）
+ * @property {Boolean} show 控制是否显示菜单项（默认true）
  */
 
 export const DropdownItemProps = {
@@ -23,7 +24,9 @@ export const DropdownItemProps = {
     /** 是否禁用此菜单项 */
     disabled: { type: Boolean, default: false },
     /** 下拉弹窗的高度 */
-    height: { type: [Number, String] as PropType<number | string>, default: 'auto' }
+    height: { type: [Number, String] as PropType<number | string>, default: 'auto' },
+    /** 控制是否显示菜单项 */
+    show: { type: Boolean, default: true }
 };
 
 export type DropdownItemProps = ExtractPropTypes<typeof DropdownItemProps>;

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

@@ -1,6 +1,6 @@
 <template>
     <view
-        v-if="active"
+        v-if="show && active"
         class="u-dropdown-item"
         :class="customClass"
         :style="$u.toStyle(customStyle)"
@@ -62,6 +62,7 @@ import { DropdownItemProps } from './types';
  * @property {Boolean} disabled 是否禁用此选项卡（默认false）
  * @property {String | Number} duration 选项卡展开和收起的过渡时间，单位ms（默认300）
  * @property {String | Number} height 弹窗下拉内容的高度(内容超出将会滚动)（默认auto）
+ * @property {Boolean} show 控制是否显示菜单项（默认true）
  * @example <u-dropdown-item title="标题"></u-dropdown-item>
  */
 
@@ -84,7 +85,7 @@ const activeColor = computed(() => parentExposed.value?.props?.activeColor || $u
 const inactiveColor = computed(() => parentExposed.value?.props?.inactiveColor || $u.color.contentColor);
 
 // 监听props变化，通知父组件重新初始化
-const propsChange = computed(() => `${props.title}-${props.disabled}`);
+const propsChange = computed(() => `${props.title}-${props.disabled}-${props.show}`);
 
 // 监听propsChange变化，通知父组件重新init
 watch(propsChange, () => {

package/components/u-form-item/u-form-item.vue

@@ -218,6 +218,31 @@ function broadcastInputError() {
     broadcast('onFormItemError', validateState.value === 'error' && showError.value('border'));
 }
 
+/**
+ * 根据路径获取对象的值（支持嵌套路径，如 'a.b.c'）
+ * @param obj 对象
+ * @param path 路径字符串
+ */
+function getPropByPath(obj: any, path: string) {
+    if (!obj || !path) return { o: obj, k: '', v: undefined };
+
+    const paths = path.split('.');
+    let current = obj;
+    let key = '';
+
+    for (let i = 0; i < paths.length; i++) {
+        key = paths[i];
+        if (!current) break;
+
+        if (i === paths.length - 1) {
+            return { o: current, k: key, v: current[key] };
+        }
+        current = current[key];
+    }
+
+    return { o: current, k: key, v: undefined };
+}
+
 /**
  * 获取当前u-form-item的校验规则
  */
@@ -268,8 +293,10 @@ function getFilteredRule(triggerType = '') {
  * @param callback 校验回调
  */
 function validation(trigger: string, callback: (msg: string) => void = () => {}) {
-    // 检验之前，先获取需要校验的值
-    fieldValue.value = parentExposed?.value?.model?.value[props.prop];
+    // 检验之前，先获取需要校验的值（支持嵌套路径）
+    const propPath = getPropByPath(parentExposed?.value?.model?.value, props.prop);
+    fieldValue.value = propPath.v;
+
     // blur和change是否有当前方式的校验规则
     let rules = getFilteredRule(trigger);
     // 判断是否有验证规则，如果没有规则，也调用回调方法，否则父组件u-form会因为
@@ -282,7 +309,7 @@ function validation(trigger: string, callback: (msg: string) => void = () => {})
     validateState.value = 'validating';
     // 调用async-validator的方法
     let validator = new schema({ [props.prop]: rules });
-    validator.validate({ [props.prop]: fieldValue.value }, { firstFields: true }, (errors: any, fields: any) => {
+    validator.validate({ [props.prop]: fieldValue.value }, { firstFields: true }, (errors: any) => {
         // 记录状态和报错信息
         validateState.value = !errors ? 'success' : 'error';
         validateMessage.value = errors ? errors[0].message : '';
@@ -296,7 +323,11 @@ function validation(trigger: string, callback: (msg: string) => void = () => {})
  */
 function resetField() {
     if (parentExposed?.value?.model?.value && props.prop) {
-        parentExposed.value.model.value[props.prop] = initialValue.value;
+        // 支持嵌套路径的重置
+        const propPath = getPropByPath(parentExposed.value.model.value, props.prop);
+        if (propPath.o && propPath.k) {
+            propPath.o[propPath.k] = initialValue.value;
+        }
     }
     // 设置为`success`状态，只是为了清空错误标记
     // 延时50毫秒，如果立即清空状态，则无法清空错误标记
@@ -324,8 +355,9 @@ onMounted(() => {
                         prop: props.prop
                     });
                 errorType.value = parentExposed?.value?.errorType || errorType.value;
-                // 设置初始值
-                fieldValue.value = parentExposed?.value?.model?.value[props.prop];
+                // 设置初始值（支持嵌套路径）
+                const propPath = getPropByPath(parentExposed?.value?.model?.value, props.prop);
+                fieldValue.value = propPath.v;
                 // 设置初始值
                 initialValue.value = fieldValue.value;
             }

package/components/u-link/types.ts

@@ -35,6 +35,11 @@ export const LinkProps = {
     lineColor: {
         type: String,
         default: ''
+    },
+    /** 是否默认点击跳转 */
+    defaultClick: {
+        type: Boolean,
+        default: true
     }
 };
 

package/components/u-link/u-link.vue

@@ -43,12 +43,17 @@ import { LinkProps } from './types';
  * @example <u-link href="https://uviewpro.cn">蜀道难，难于上青天</u-link>
  */
 const props = defineProps(LinkProps);
+const emit = defineEmits(['click']);
 
 /**
  * 打开链接方法
  * 不同平台有不同表现形式
  */
 function openLink() {
+    if (!props.defaultClick) {
+        emit('click', props.href);
+        return;
+    }
     // #ifdef APP-PLUS
     if (typeof plus !== 'undefined' && plus.runtime) {
         plus.runtime.openURL(props.href);

package/components/u-safe-bottom/props.ts

@@ -5,7 +5,7 @@ import { baseProps } from '../common/props';
  * SafeBottomProps SafeBottom 底部安全区
  */
 export const SafeBottomProps = {
-    ...baseProps,
+    ...baseProps
 };
 
 export type SafeBottomProps = ExtractPropTypes<typeof SafeBottomProps>;

package/components/u-status-bar/props.ts

@@ -7,7 +7,7 @@ export const StatusBarProps = {
     background: {
         type: String,
         default: 'transparent'
-    },
+    }
 };
 
 export type StatusBarProps = ExtractPropTypes<typeof StatusBarProps>;

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

@@ -119,7 +119,6 @@ function initObserver() {
     // #ifndef H5
     stickyTop.value = Number(props.offsetTop) !== 0 ? uni.upx2px(Number(props.offsetTop)) : 0;
     // #endif
-    console.log('stickyTop.value', stickyTop.value);
     disconnectObserver('contentObserver');
     $u.getRect('.' + elClass.value, instance).then((res: any) => {
         height.value = res.height;

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

@@ -6,6 +6,7 @@
                 <view class="u-scroll-box" :id="id" :class="{ 'u-tabs-scroll-flex': !isScroll }">
                     <view
                         class="u-tab-item u-line-1"
+                        :class="[item.hidden ? 'u-tab-item-hidden' : '']"
                         :id="'u-tab-item-' + index"
                         v-for="(item, index) in list"
                         :key="index"
@@ -290,6 +291,10 @@ scroll-view ::v-deep ::-webkit-scrollbar {
     transition-property: background-color, color;
 }
 
+.u-tab-item-hidden {
+    display: none;
+}
+
 .u-tab-bar {
     position: absolute;
     bottom: 0;

package/components/u-text/u-text.vue

@@ -5,7 +5,7 @@
         :class="[
             props.bold ? 'u-text--bold' : '',
             props.block ? 'u-text--block' : 'u-text--inline',
-            props.lines ? 'u-text--ellipsis' : '',
+            props.lines ? 'u-text--ellipsis u-text--block' : '',
             `u-text--align-${props.align}`,
             customClass
         ]"
@@ -206,8 +206,12 @@ const textValueStyle = computed(() => {
             : undefined
     };
     if (props.lines) {
-        style['display'] = '-webkit-box';
-        style['-webkit-box-orient'] = 'vertical';
+        if (props.lines == 1) {
+            style['display'] = 'block';
+        } else {
+            style['display'] = '-webkit-box';
+            style['-webkit-box-orient'] = 'vertical';
+        }
     }
     if (!props.type) style.color = props.color;
     if (isNvue.value && props.lines) style.lines = props.lines;

package/components/u-waterfall/u-waterfall.vue

@@ -23,9 +23,11 @@ export default {
 </script>
 
 <script setup lang="ts">
-import { ref, computed, watch, onMounted, getCurrentInstance } from 'vue';
-import { $u } from '../..';
+import { ref, computed, watch, onMounted } from 'vue';
 import { WaterfallProps } from './types';
+import { useRect, $u } from '../../';
+
+const { getRect } = useRect();
 
 /**
  * waterfall 瀑布流
@@ -43,7 +45,6 @@ const props = defineProps(WaterfallProps);
 const leftList = ref<any[]>([]);
 const rightList = ref<any[]>([]);
 const tempList = ref<any[]>([]);
-const instance = getCurrentInstance();
 
 /**
  * 破坏 flowList 变量的引用，否则 watch 的结果新旧值是一样的
@@ -67,7 +68,7 @@ onMounted(() => {
  * 复制而不是引用对象和数组
  */
 function cloneData(data: any) {
-    return JSON.parse(JSON.stringify(data));
+    return $u.deepClone(data);
 }
 
 /**
@@ -75,8 +76,8 @@ function cloneData(data: any) {
  */
 async function splitData() {
     if (!tempList.value.length) return;
-    const leftRect = await $u.getRect('#u-left-column', instance);
-    const rightRect = await $u.getRect('#u-right-column', instance);
+    const leftRect = await getRect('#u-left-column');
+    const rightRect = await getRect('#u-right-column');
     // 如果左边小于或等于右边，就添加到左边，否则添加到右边
     const item = tempList.value[0];
     // 解决多次快速上拉后，可能数据会乱的问题，因为经过上面的两个await节点查询阻塞一定时间，加上后面的定时器干扰

package/libs/hooks/useRect.ts

@@ -6,17 +6,19 @@ import { getCurrentInstance, nextTick, ref } from 'vue';
  * @param all 是否获取所有匹配元素
  * @returns rect 响应式的节点信息，refresh 主动刷新方法
  */
-export function useRect(selector: string, all = false) {
+export function useRect(selector: string = null, all = false) {
     const rect = ref<any>(all ? [] : null);
     const instance = getCurrentInstance();
 
-    async function refreshRect(delay = 0) {
+    async function getRect(realSelector: string = null, delay = 0): Promise<any> {
+        realSelector = realSelector || selector;
+        if (!realSelector) return rect.value;
         await nextTick();
         return new Promise(resolve => {
             setTimeout(() => {
                 uni.createSelectorQuery()
                     .in(instance?.proxy)
-                    [all ? 'selectAll' : 'select'](selector)
+                    [all ? 'selectAll' : 'select'](realSelector)
                     .boundingClientRect((res: any) => {
                         rect.value = res;
                         resolve(res);
@@ -28,6 +30,6 @@ export function useRect(selector: string, all = false) {
 
     return {
         rect,
-        refreshRect
+        getRect
     };
 }

package/package.json

@@ -2,7 +2,7 @@
     "id": "uview-pro",
     "name": "uview-pro",
     "displayName": "【支持鸿蒙】uView Pro｜基于Vue3+TS全面重构的80+精选UI组件库",
-    "version": "0.3.14",
+    "version": "0.3.16",
     "description": "uView Pro，是全面支持Vue3的uni-app生态框架，80+精选组件已使用TypeScript重构，已全面支持uni-app Vue3.0",
     "main": "index.ts",
     "module": "index.ts",

package/readme.md

@@ -1,5 +1,5 @@
 <p align="center">
-    <img alt="logo" src="https://ik.imagekit.io/anyup/uview-pro/common/logo.png" width="120" height="120" style="margin-bottom: 10px;">
+    <img alt="logo" src="https://ik.imagekit.io/anyup/uview-pro/common/logo-new.png" width="120" height="120" style="margin-bottom: 10px;">
 </p>
 <h3 align="center" style="margin: 30px 0 30px;font-weight: bold;font-size:40px;">uView Pro</h3>
 <h3 align="center">uni-app Vue3 多平台快速开发的 UI 框架</h3>

package/types/global.d.ts

@@ -271,6 +271,7 @@ export type TabsItem = {
     [key: string]: any;
     name?: string | number;
     count?: string | number;
+    hidden?: boolean;
 };
 // tabs-swiper 组件 list item
 export type TabsSwiperListItem = {