Refactor(首页):改版重构-界面完成

components/xdd-tabbar/index.vue

@@ -25,9 +25,14 @@
           @click="gotoPage(item.url, item.type, item.index)"
         >
           <view class="img-wrap">
+            <!-- 预加载两张图片，可以在点击切换的时候不闪屏 -->
             <image
-              :src="currIndex === item.index ? item.onIcon : item.offIcon"
-              class="img"
+              :src="item.onIcon"
+              class="img on"
+            />
+            <image
+              :src="item.offIcon"
+              class="img off"
             />
           </view>
           <view class="name">{{ item.name }}</view>
@@ -144,6 +149,12 @@ export default {
           width: 44rpx;
           height: 44rpx;
           margin: 0 auto;
+          &.on {
+            display: none;
+          }
+          &.off {
+            display: block;
+          }
         }
       }
       .name {
@@ -158,6 +169,12 @@ export default {
           .name {
             color: #C52733;
           }
+          .on {
+            display: block;
+          }
+          .off {
+            display: none;
+          }
         }
       }
     }