From ec0d49888b3f79ebb0874fca4cf71bb5ddd71d81 Mon Sep 17 00:00:00 2001
From: helang <helang.love@qq.com>
Date: Fri, 18 Oct 2024 22:35:22 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E7=80=91=E5=B8=83=E6=B5=81-v1.2.2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../uni_modules/helang-waterfall/changelog.md  |  2 ++
 .../components/waterfall/waterfall-list.vue    | 13 +++++++++----
 .../pages/waterfall/waterfall.vue              |  4 ++--
 .../uni_modules/helang-waterfall/readme.md     | 18 ++++++++++++++----
 4 files changed, 27 insertions(+), 10 deletions(-)

diff --git a/uniapp-extend/uni_modules/helang-waterfall/changelog.md b/uniapp-extend/uni_modules/helang-waterfall/changelog.md
index ab28fbd..7006924 100644
--- a/uniapp-extend/uni_modules/helang-waterfall/changelog.md
+++ b/uniapp-extend/uni_modules/helang-waterfall/changelog.md
@@ -1,3 +1,5 @@
+## 1.2.2（2024-10-18）
+- [修复] 解决了因为数据id重复导致的 小程序平台  waterfall-item 组件不会重新渲染的问题
 ## 1.2.1（2024-10-07）
 全新升级为组件+插槽的方案实现，极大的简便了组件的使用和内容调整。
 ## 1.1.6（2022-10-24）
diff --git a/uniapp-extend/uni_modules/helang-waterfall/components/waterfall/waterfall-list.vue b/uniapp-extend/uni_modules/helang-waterfall/components/waterfall/waterfall-list.vue
index 2a3a10a..91f608a 100644
--- a/uniapp-extend/uni_modules/helang-waterfall/components/waterfall/waterfall-list.vue
+++ b/uniapp-extend/uni_modules/helang-waterfall/components/waterfall/waterfall-list.vue
@@ -20,12 +20,16 @@
 </template>
 
 <script>
+	// 字符串前缀
+	const prefixStr = '__waterfall_';
 	// 图片高度键名
-	const IMAGE_HEIGHT_KEY = '__waterfall_imageHeight';
+	const IMAGE_HEIGHT_KEY = `${prefixStr}imageHeight`;
 	// 图片缓存键名
-	const IMAGE_CACHE_KEY = '__waterfall_cacheImageHeight';
+	const IMAGE_CACHE_KEY = `${prefixStr}cacheImageHeight`;
 	// 是否渲染
-	const ITEM_SHOW_KEY = '__waterfall_show';
+	const ITEM_SHOW_KEY = `${prefixStr}show`;
+	// 渲染ID
+	const RENDER_ID = `${prefixStr}renderId`;
 	// 图片链接键名
 	let IMAGE_URL_KEY = '';
 	// 图片PX宽度
@@ -171,7 +175,8 @@
 				
 				this.renderList[index].push({
 					...data,
-					[IMAGE_HEIGHT_KEY]: `${data[IMAGE_HEIGHT_KEY]}px`
+					[IMAGE_HEIGHT_KEY]: `${data[IMAGE_HEIGHT_KEY]}px`,
+					[RENDER_ID]: `${prefixStr}${Date.now()}`
 				});
 			},
 			// 添加所有渲染数据，方案存在问题暂
diff --git a/uniapp-extend/uni_modules/helang-waterfall/pages/waterfall/waterfall.vue b/uniapp-extend/uni_modules/helang-waterfall/pages/waterfall/waterfall.vue
index bad860e..42486b6 100644
--- a/uniapp-extend/uni_modules/helang-waterfall/pages/waterfall/waterfall.vue
+++ b/uniapp-extend/uni_modules/helang-waterfall/pages/waterfall/waterfall.vue
@@ -15,7 +15,7 @@
 					<template>
 						<waterfall-item  
 							v-for="(item,index) in colItem" 
-							:key="item.id" 
+							:key="item.__waterfall_renderId" 
 							:colIndex="colIndex"
 							@height="onRenderHeight"
 						>
@@ -26,7 +26,7 @@
 									:src="item.imgUrl" 
 									:style="{height:item.__waterfall_imageHeight}"
 								>
-									<!-- 必须给图片的高度这事为 __waterfall_imageHeight 属性的高 -->
+									<!-- 必须给图片的高度设置为 __waterfall_imageHeight 属性的高 -->
 								</image>
 								<view class="title">{{item.title}}</view>
 								<view class="label ellipsis-1">{{item.label}}</view>
diff --git a/uniapp-extend/uni_modules/helang-waterfall/readme.md b/uniapp-extend/uni_modules/helang-waterfall/readme.md
index e092d17..7dfa13b 100644
--- a/uniapp-extend/uni_modules/helang-waterfall/readme.md
+++ b/uniapp-extend/uni_modules/helang-waterfall/readme.md
@@ -41,10 +41,20 @@ export default {
 ### 容器组件 waterfall-list
 
 #### 插槽 
-插槽名称 | 说明
---------|------
-default | 瀑布流列表内容，放置 `waterfall-col` 组件
-tips | 瀑布流列表下方提示信息
+插槽名称 | 透传数据 | 说明
+--------|------|------
+default | 详情见default插槽透传数据说明 |瀑布流列表内容，放置 `waterfall-col` 组件
+tips | - | 瀑布流列表下方提示信息
+
+#### default插槽透传数据说明 
+
+- 数据结构：`{ list,colWidth }`
+- 字段说明：
+	1. list：渲染的数据列表，数据增加了 `__waterfall_renderId`、`__waterfall_imageHeight` 属性
+		1. `__waterfall_renderId` 用于&lt;waterfall-item&gt;组件循环渲染的 `key`
+		2. `__waterfall_imageHeight` 用于&lt;image&gt;标签的 `style高度`
+	2. colWidth：栏目的宽度，用于 &lt;waterfall-col&gt; 组件的`colWidth`属性
+
 
 ####  属性
 
-- 
Gitee