fix(harmony): 商品列表改用 :style 控制显示隐藏,修复鸿蒙下不显示问题

- 根因:.goods-list 默认 display:none,依赖 .show class 显示
- 鸿蒙 ArkUI 对 :class 动态绑定支持不完善,isList=true 时 .show 未正确添加
- 改用 :style 内联样式控制 display,优先级高于 class 且更可靠
- 同时把 v-for key 从 index 改为 item.id 提升 diff 准确性
- 移除之前无效的 renderKey 强制刷新逻辑
This commit is contained in:
2026-06-05 11:19:05 +08:00
parent 6027f0d6de
commit 1ab8a52c38
2 changed files with 45 additions and 56 deletions

View File

@@ -47,8 +47,8 @@
<mescroll-uni top="180" ref="mescroll" @getData="getGoodsList">
<block slot="list">
<view class="goods-list single-column" :class="{ show: isList }">
<view class="goods-item margin-bottom" v-for="(item, index) in goodsList" :key="index"
<view class="goods-list single-column" :class="{ show: isList }" :style="{ display: isList ? 'block' : 'none' }">
<view class="goods-item margin-bottom" v-for="(item, index) in goodsList" :key="item.id"
@click="toDetail(item)">
<view class="goods-img">
<image :src="goodsImg(item.goods_image)" mode="widthFix" @error="imgError(index)" show-menu-by-longpress ></image>
@@ -97,8 +97,8 @@
</view>
</view>
</view>
<view class="goods-list double-column" :class="{ show: !isList }">
<view class="goods-item margin-bottom" v-for="(item, index) in goodsList" :key="index"
<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"
@click="toDetail(item)"
:style="{ left: listPosition[index] ? listPosition[index].left : '', top: listPosition[index] ? listPosition[index].top : '' }">
<view class="goods-img">

View File

@@ -259,17 +259,6 @@ export default {
this.goodsList = this.goodsList.concat(newArr); //追加新数据
if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
// #ifdef MP-HARMONY
// 鸿蒙 ArkUI 对 v-for 数组响应式更新支持不完善,强制触发视图刷新
setTimeout(() => {
const temp = this.isList;
this.isList = !temp;
setTimeout(() => {
this.isList = temp;
}, 0);
}, 50);
// #endif
this.waterfallflow((mescroll.num - 1) * 10);
},
fail: res => {