更新

ghsPad/src/mixins/product.js

@@ -613,6 +613,9 @@ export default {
             this.globalRightItemInfloList = this.globalRightAllItemInfo[this.globalRightItemCategoryId]
         },
         globalChangeCategory(item){
+            if (!item || item.id == null) {
+                return false
+            }
             if(item.id === this.globalRightItemCategoryId){
                 return false
             }

ghsPad/src/pages/home/components/rightGoods.vue

@@ -9,13 +9,13 @@
         </view>
         <scroll-view class="shop-show_box" enable-flex="true" scroll-y="true" lower-threshold="20" @scrolltolower="reachBottom">
             <view class="goods-item-area">
-            <view v-for="item in list.data" :key="item.id" class="show-shop_box">
+            <view v-for="(item, goodsIdx) in list.data" :key="goodsItemRowKey(item, goodsIdx)" class="show-shop_box">
                 <view class="item-detail" @click="popAddModelFn(item)">
-                    <image class="img" :src="item.smallCover" lazy-load="true" :lazy-load-margin="0" mode="scaleToFill" ></image>
+                    <image class="img" :key="goodsItemRowKey(item, goodsIdx)" :src="item.smallCover" :lazy-load="false" mode="scaleToFill" ></image>
                     <view class="shop-info_price">
                         <view>
-                            <view>{{item.name}}</view>
-                            <view style="display:flex;justify-content: space-between;padding-right:2upx;">
+                            <text class="goods-card-name" :key="'gn-' + item.id + '-' + goodsIdx">{{ item.name }}</text>
+                            <view class="goods-card-meta" >
                                 <text>￥{{parseFloat(item.price)}}</text>
                                 <text>剩{{parseFloat(item.stock)}}</text>
                             </view>
@@ -105,6 +105,12 @@ export default {
         }
     },
     methods:{
+        /** 与收银花材格一致：稳定行 key + text 承载标题，减轻 App 端「名图不同步」 */
+        goodsItemRowKey(item, index) {
+            const id = item && item.id != null ? item.id : 'noid'
+            const prop = item && item.property !== undefined && item.property !== null ? item.property : 1
+            return `gd-${id}-${prop}-${index}`
+        },
         itemRefresh(){
         },
         addToClear(){
@@ -238,15 +244,19 @@ export default {
                         box-sizing: border-box;
                         z-index: 10;
                         & > view {
-                            & > view:nth-child(1) {
+                            & > .goods-card-name {
+                                display: block;
                                 overflow: hidden;
-                                text-overflow:ellipsis;
+                                text-overflow: ellipsis;
                                 white-space: nowrap;
-                                width:90%;
+                                width: 90%;
                                 font-size: 9upx;
                             }
-                            & > view:nth-child(2) {
-                                font-size:7upx;
+                            & > .goods-card-meta {
+                                display: flex;
+                                justify-content: space-between;
+                                padding-right: 2upx;
+                                font-size: 7upx;
                             }
                         }
                     }

ghsPad/src/pages/home/components/rightItem.vue

@@ -19,21 +19,33 @@
         </view>
 
         <view class="cat-list-area">
-            <view v-for="item in globalRightItemClass" :key="item.id" :class="[globalRightItemCategoryId===item.id?'active':'']" @click="handleCategoryClick(item)" > {{item.name}} </view>
+            <!-- 小程序端 @click="fn(item)" 对 v-for 变量传递不稳定，改用 data-index + 列表取项 -->
+            <view
+                v-for="(catItem, catIdx) in globalRightItemClass"
+                :key="categoryTabKey(catItem, catIdx)"
+                :class="[globalRightItemCategoryId===catItem.id?'active':'']"
+                :data-cid="catItem.id"
+                :data-cat-index="catIdx"
+                @click.stop="handleCategoryClick"
+            >
+                <text class="cat-tab-name">{{ catItem.name }}</text>
+            </view>
         </view>
         <view class="shop-show_box">
             <view v-if="filteredItemList.length === 0" class="no-data-tip">
                 <text>{{ searchKeyword ? '未找到相关花材' : '暂无花材' }}</text>
             </view>
-            <view v-for="item in filteredItemList" :key="item.id" class="show-shop_box">
+            <!-- key：id+property+下标，避免任意重复键；名称须用 text，避免 App 端 view 插值与 image 异步刷新不同步出现「名错图对」 -->
+            <view v-for="(item, flowerIdx) in filteredItemList" :key="flowerItemRowKey(item, flowerIdx)" class="show-shop_box">
                 <view class="item-detail" @click="popAddModelFn(item)">
-                    <image class="img" :src="item.cover" lazy-load="true" :lazy-load-margin="0" mode="scaleToFill" ></image>
+                    <!-- 收银格图片小，关闭懒加载可减少原生 image 与底部文案层的刷新不同步（偶发相邻标题串位） -->
+                    <image class="img" :key="flowerItemRowKey(item, flowerIdx)" :src="item.cover" :lazy-load="false" mode="scaleToFill" ></image>
                     <!-- 多颜色类型标识 -->
                     <view v-if="item.variety == 1" class="variety-badge"></view>
                     <view class="shop-info_price">
                         <view>
-                            <view @click.stop="quickAddItem(item)">{{item.name}}</view>
-                            <view style="display:flex;justify-content: space-between;padding-right:2upx;" @click.stop="quickAddItem(item)">
+                            <text class="flower-card-name" :key="'nm-' + item.id + '-' + flowerIdx" @click.stop="quickAddItem(item)">{{ item.name }}</text>
+                            <view class="flower-card-meta" @click.stop="quickAddItem(item)">
                                 <text>￥{{parseFloat(item.price)}}</text>
                                 <text v-if="Number(item.reachNumDiscount)>0 && Number(item.reachNum)>0" style="color:#FFEB3B;">{{ item.reachNum }}↓{{ item.reachNumDiscount?parseFloat(item.reachNumDiscount):0 }}</text>
                                 <text>剩{{parseFloat(item.stock)}}</text>
@@ -157,6 +169,17 @@ export default {
         }
     },
     methods:{
+        /** 顶部分类 tab：id + 下标，避免 App 端同结构列表偶发文字与点击项不一致 */
+        categoryTabKey(catItem, index) {
+            const id = catItem && catItem.id != null ? catItem.id : 'noid'
+            return `cat-${id}-${index}`
+        },
+        /** 列表行 key：优先 id+property（多规格），再拼下标保证唯一，避免 v-for 在部分端上节点复用异常 */
+        flowerItemRowKey(item, index) {
+            const id = item && item.id != null ? item.id : 'noid'
+            const prop = item && item.property !== undefined && item.property !== null ? item.property : 1
+            return `fl-${id}-${prop}-${index}`
+        },
         addToClear(){
             this.$msg('请扫码打开')
         },
@@ -166,11 +189,26 @@ export default {
                 this.closeSearchBox()
             }
         },
-        handleCategoryClick(item){
-            // 点击分类时清空搜索框
+        handleCategoryClick(e){
+            const cur = e && e.currentTarget ? e.currentTarget : (e && e.target)
+            const ds = cur && cur.dataset ? cur.dataset : {}
+            const list = this.globalRightItemClass || []
+            let cat = null
+            if (ds.cid !== undefined && ds.cid !== '') {
+                const cid = ds.cid
+                cat = list.find(function (c) { return String(c.id) === String(cid) })
+            }
+            if (!cat && ds.catIndex !== undefined && ds.catIndex !== '') {
+                const idx = Number(ds.catIndex)
+                if (!isNaN(idx)) {
+                    cat = list[idx]
+                }
+            }
+            if (!cat || cat.id == null) {
+                return
+            }
             this.searchKeyword = ''
-            // 调用原来的分类切换方法
-            this.globalChangeCategory(item)
+            this.globalChangeCategory(cat)
         },
         toggleSearchBox(){
             this.showSearchBox = !this.showSearchBox
@@ -278,14 +316,18 @@ export default {
                     box-sizing: border-box;
                     z-index: 10;
                     & > view {
-                        & > view:nth-child(1) {
+                        & > .flower-card-name {
+                            display: block;
                             overflow: hidden;
                             white-space: nowrap;
-                            width:100%;
-                            font-size:9upx;
+                            width: 100%;
+                            font-size: 9upx;
                         }
-                        & > view:nth-child(2) {
-                            font-size:7upx;
+                        & > .flower-card-meta {
+                            display: flex;
+                            justify-content: space-between;
+                            padding-right: 2upx;
+                            font-size: 7upx;
                         }
                     }
                 }
@@ -306,13 +348,18 @@ export default {
             padding: 8upx 0upx;
             font-size: 9upx;
             width: 68upx;
-            overflow: hidden;
-            white-space: nowrap;
             text-align: center;
             &.active {
                 background-color: #3385FF;
                 color: #ffffff;
             }
+            .cat-tab-name {
+                display: block;
+                overflow: hidden;
+                white-space: nowrap;
+                width: 100%;
+                font-size: 9upx;
+            }
         }
     }
     & .shop-show_box {