uview-plus 3.3.42 → 3.3.43

package/changelog.md

@@ -1,3 +1,10 @@
+## 3.3.43（2024-11-18）
+fix: 支持瀑布流组件v-model置为[]
+
+add: 新增字符串路径访问工具方法getValueByPath
+
+add: 新增float-button悬浮按钮组件
+
 ## 3.3.42（2024-11-15）
 add: button组件支持stop参数阻止冒泡
 

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

@@ -1,7 +1,12 @@
 <template>
     <view
-        class="u-float-button" :class="class">
-        <view class="u-float-button__main" @click.stop="clickHandler" :style="{
+        class="u-float-button" :style="{
+            position: 'fixed',
+            top: top,
+            bottom: bottom,
+            right: right,
+        }">
+        <view class="u-float-button__main" @click="clickHandler" :style="{
             backgroundColor: backgroundColor,
             color: color,
             flexDirection: 'row',
@@ -9,37 +14,33 @@
             alignItems: 'center',
             width: width,
             height: height,
-            position: 'absolute',
-            bottom: bottom,
-            right: right,
             borderRadius: '50%',
             borderColor: borderColor,
         }">
             <slot :showList="showList">
-                <up-icon :class="{'show-list': showList}" name="plus" :color="color"></up-icon>
+                <up-icon class="cursor-pointer" :class="{'show-list': showList}" name="plus" :color="color"></up-icon>
             </slot>
-            <slot name="list">
-                <view class="u-float-button__list" :style="{
-                    bottom: bottom,
-                    right: right
-                }">
+            <view v-if="showList" class="u-float-button__list" :style="{
+                bottom: height
+            }">
+                <slot name="list">
                     <template v-for="item in list">
                         <view class="u-float-button__item" :style="{
-                            backgroundColor: item?.bgColor || bgColor,
-                            color: item?.color || color,
+                            backgroundColor: item?.backgroundColor ? item?.backgroundColor : backgroundColor,
+                            color: item?.color ? item?.color : color,
                             flexDirection: 'row',
                             justifyContent: 'center',
                             alignItems: 'center',
                             width: width,
                             height: height,
                             borderRadius: '50%',
-                            borderColor: item?.borderColor || borderColor,
+                            borderColor: item?.borderColor ? item?.borderColor :  borderColor,
                         }" @click="itemClick(item, index)">
-                            <up-icon :name="item.name" :color="item?.color || color"></up-icon>
+                            <up-icon :name="item.name" :color="item?.color ? item?.color : color"></up-icon>
                         </view>
                     </template>
-                </view>
-            </slot>
+                </slot>
+            </view>
         </view>
     </view>
 </template>
@@ -52,9 +53,9 @@ import { addStyle, addUnit, deepMerge } from '../../libs/function/index';
  * FloatButton 悬浮按钮
  * @description 悬浮按钮常用于屏幕右下角点击展开的操作菜单
  * @tutorial https://ijry.github.io/uview-plus/components/floatButton.html
- * @property {String}                bgColor      背景颜色
+ * @property {String}                backgroundColor      背景颜色
  * @event {Function} click  点击触发事件
- * @example <up-view></up-view>
+ * @example <up-float-button></up-float-button>
  */
 export default {
     name: 'u-float-button',
@@ -66,17 +67,59 @@ export default {
     // #endif
    emits: ['click', 'item-click'],
     computed: {
-        valueStyle() {}
     },
     props: {
-        bgColor: '#2979ff',
-        color: '#fff',
-        width: '50px',
-        height: '50px',
-        borderColor: '',
-        right: '80px',
-        bottom: '100px',
-        isMenu: false
+        // 背景颜色
+        backgroundColor: {
+            type: String,
+            default: '#2979ff'
+        },
+        // 文字颜色
+        color: {
+            type: String,
+            default: '#fff'
+        },
+        // 宽度
+        width: {
+            type: String,
+            default: '50px'
+        },
+        // 高度
+        height: {
+            type: String,
+            default: '50px'
+        },
+        // 边框颜色，默认为空字符串表示无边框
+        borderColor: {
+            type: String,
+            default: ''
+        },
+        // 右侧偏移量
+        right: {
+            type: [String, Number],
+            default: '30px'
+        },
+        // 顶部偏移量，未提供默认值，可能需要根据具体情况设置
+        top: {
+            type: [String, Number],
+            default: '',
+        },
+        // 底部偏移量
+        bottom: {
+            type: String,
+            default: ''
+        },
+        // 是否为菜单项
+        isMenu: {
+            type: Boolean,
+            default: false
+        },
+        list: {
+            type: Array,
+            default: () => {
+                return []
+            }
+        }
     },
     data() {
         return {
@@ -88,6 +131,7 @@ export default {
         clickHandler(e) {
             if (this.isMenu) {
                 this.showList = !this.showList
+                this.$emit('click', e)
             } else {
                 this.$emit('click', e)
             }
@@ -106,6 +150,7 @@ export default {
 @import '../../libs/css/components.scss';
 
 .u-float-button {
+    z-index: 999;
     .show-list {
         transform: rotate(45deg);
     }

package/components/u-image/u-image.vue

@@ -6,7 +6,7 @@
 		:duration="fade ? 1000 : 0"
 	>
 		<view
-			class="u-image"
+			class="u-image box-border"
 			@tap="onClick"
 			:style="[wrapStyle, backgroundStyle]"
 		>

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

@@ -67,11 +67,16 @@
         },
         watch: {
             copyFlowList(nVal, oVal) {
-                // 取差值，即这一次数组变化新增的部分
-                let startIndex = Array.isArray(oVal) && oVal.length > 0 ? oVal.length : 0;
-                // 拼接上原有数据
-                this.tempList = this.tempList.concat(this.cloneData(nVal.slice(startIndex)));
-                this.splitData();
+                if (!nVal || nVal.length == 0) {
+                    this.clear();
+                    // console.log('clear');
+                } else {
+                    // 取差值，即这一次数组变化新增的部分
+                    let startIndex = Array.isArray(oVal) && oVal.length > 0 ? oVal.length : 0;
+                    // 拼接上原有数据
+                    this.tempList = this.tempList.concat(this.cloneData(nVal.slice(startIndex)));
+                    this.splitData();
+                }
             }
         },
         mounted() {
@@ -81,12 +86,18 @@
         computed: {
             // 破坏flowList变量的引用，否则watch的结果新旧值是一样的
             copyFlowList() {
+                // #ifdef VUE3
+                if (!this.modelValue || this.modelValue.length == 0) {
+                    this.clear();
+                    // console.log('clear');
+                    return [];
+                } else {
+                    return this.cloneData(this.modelValue);
+                }
+                // #endif
                 // #ifdef VUE2
                 return this.cloneData(this.value);
                 // #endif
-                // #ifdef VUE3
-                return this.cloneData(this.modelValue);
-                // #endif
             }
         },
         emits: ['update:modelValue'],

package/libs/function/index.js

@@ -694,6 +694,17 @@ export function pages() {
 	return pages
 }
 
+export function getValueByPath(obj, path) {
+    // 将路径字符串按 '.' 分割成数组
+    const pathArr = path.split('.');
+    // 使用 reduce 方法从 obj 开始，逐级访问嵌套属性
+    return pathArr.reduce((acc, curr) => {
+        // 如果当前累加器（acc）是对象且包含当前键（curr），则返回该键对应的值
+        // 否则返回 undefined（表示路径不存在）
+        return acc && acc[curr] !== undefined ? acc[curr] : undefined;
+    }, obj);
+}
+
 export default {
 	range,
 	getPx,
@@ -724,5 +735,6 @@ export default {
 	setProperty,
 	page,
 	pages,
+	getValueByPath,
 	// setConfig
 }

package/package.json

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