fix(harmony): 双列模式首次切换时瀑布流错位导致图片重影

鸿蒙下双列 items 一直在 display:none 状态下渲染,首次切换时
boundingClientRect 测得尺寸为 0,waterfallflow 算出来的 left/top
让 items 全部叠在一起。

修复:通过 :key 加 isList 前缀,切换模式时强制重建 DOM,新 DOM
在 display:flex 可见状态下生成,测量正确。

平台判断放在 mixin 的 goodsItemKey 方法里用 JS 条件编译,模板
只调方法,避免在 vue 模板里写 #ifdef/#else(uni-app 不支持)。

pages_goods/list.vue

@@ -98,7 +98,9 @@
 				</view>
 			</view>
 			<view class="goods-list double-column" :class="{ show: !isList }" :style="{ display: !isList ? 'flex' : 'none' }">
-				<view class="goods-item margin-bottom" v-for="(item, index) in goodsList" :key="item.id"
+				<!-- 鸿蒙下双列 items 一直在 display:none 状态下渲染,首次切换时尺寸测量不对导致瀑布流错位
+				     :key 加 isList 前缀强制重建 DOM (goodsItemKey 内有条件编译,H5/微信走原样) -->
+				<view class="goods-item margin-bottom" v-for="(item, index) in goodsList" :key="goodsItemKey(item)"
 					@click="toDetail(item)"
 					:style="{ left: listPosition[index] ? listPosition[index].left : '', top: listPosition[index] ? listPosition[index].top : '' }">
 						<view class="goods-img">

pages_goods/public/js/list.js

@@ -489,6 +489,20 @@ export default {
 		},
 		genNonDuplicate(len = 6) {
 			return Number(Math.random().toString().substr(3, len) + Date.now()).toString(36);
+		},
+		/**
+		 * 鸿蒙下双列 items 一直在 display:none 状态下渲染,首次切换时尺寸测量不对导致瀑布流错位
+		 * 通过 :key 加 isList 前缀,切换模式时强制重建 DOM,新 DOM 在可见状态下生成,测量正确
+		 * H5/微信不受影响,走原 item.id
+		 */
+		goodsItemKey(item) {
+			// #ifdef MP-HARMONY
+			return (this.isList ? 's-' : 'd-') + item.id;
+			// #endif
+
+			// #ifndef MP-HARMONY
+			return item.id;
+			// #endif
 		}
 	}
 }