style:新增懒加载机制
This commit is contained in:
@@ -18,7 +18,7 @@
|
||||
indicator-active-color="#07c160">
|
||||
<swiper-item v-for="(image, index) in goodsInfo.imageList" :key="index">
|
||||
<view class="swiper-item-wrapper">
|
||||
<image :src="image" mode="aspectFit" class="product-image"></image>
|
||||
<image :src="image" mode="aspectFit" class="product-image" lazy-load="true"></image>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
@@ -33,7 +33,7 @@
|
||||
<view class="features-section">
|
||||
<view class="feature-item">
|
||||
<view class="feature-icon">
|
||||
<image src="@/static/battery-icon.png" mode="aspectFit" class="icon-img"></image>
|
||||
<image src="@/static/battery-icon.png" mode="aspectFit" class="icon-img" lazy-load="true"></image>
|
||||
</view>
|
||||
<view class="" style="display: flex;flex-direction: column;align-items: center;">
|
||||
<text class="feature-label">{{ $t('goods.features.battery') }}</text>
|
||||
@@ -43,7 +43,7 @@
|
||||
|
||||
<view class="feature-item">
|
||||
<view class="feature-icon">
|
||||
<image src="@/static/wind-icon.png" mode="aspectFit" class="icon-img"></image>
|
||||
<image src="@/static/wind-icon.png" mode="aspectFit" class="icon-img" lazy-load="true"></image>
|
||||
</view>
|
||||
<view class="" style="display: flex;flex-direction: column;align-items: center;">
|
||||
<text class="feature-label">{{ $t('goods.features.wind') }}</text>
|
||||
@@ -52,7 +52,7 @@
|
||||
|
||||
<view class="feature-item">
|
||||
<view class="feature-icon">
|
||||
<image src="@/static/temp-icon.png" mode="aspectFit" class="icon-img"></image>
|
||||
<image src="@/static/temp-icon.png" mode="aspectFit" class="icon-img" lazy-load="true"></image>
|
||||
</view>
|
||||
<view class="" style="display: flex;flex-direction: column;align-items: center;">
|
||||
<text class="feature-label">{{ $t('goods.features.temp') }}</text>
|
||||
@@ -61,7 +61,7 @@
|
||||
|
||||
<view class="feature-item">
|
||||
<view class="feature-icon">
|
||||
<image src="@/static/charge-icon.png" mode="aspectFit" class="icon-img"></image>
|
||||
<image src="@/static/charge-icon.png" mode="aspectFit" class="icon-img" lazy-load="true"></image>
|
||||
</view>
|
||||
<view class="" style="display: flex;flex-direction: column;align-items: center;">
|
||||
<text class="feature-label">{{ $t('goods.features.charge') }}</text>
|
||||
@@ -82,7 +82,7 @@
|
||||
<!-- 底部购买按钮 -->
|
||||
<view class="footer">
|
||||
<view class="" style="display: flex;flex-direction: column;width: 140rpx;align-items: center;margin-right: 20rpx;" @click="GotoList">
|
||||
<image src="/static/jl.png" mode="scaleToFill" style="width: 35rpx;height:35rpx;"></image>
|
||||
<image src="/static/jl.png" mode="scaleToFill" style="width: 35rpx;height:35rpx;" lazy-load="true"></image>
|
||||
<text style="font-size: 26rpx;">定制记录</text>
|
||||
</view>
|
||||
<view class="buy-button" @click="handleBuy">
|
||||
@@ -109,7 +109,7 @@
|
||||
|
||||
<view class="sku-info">
|
||||
<image v-if="selectedSku.pictureUrl" :src="selectedSku.pictureUrl" class="sku-image"
|
||||
mode="aspectFit"></image>
|
||||
mode="aspectFit" lazy-load="true"></image>
|
||||
<view class="sku-detail">
|
||||
<text class="sku-price">¥{{ selectedSku.price || goodsInfo.price }}</text>
|
||||
<text class="sku-name">{{ selectedSku.optionName || '请选择规格' }}</text>
|
||||
|
||||
@@ -12,7 +12,7 @@
|
||||
<view class="order-list">
|
||||
<view class="empty-state" v-if="orderList.length === 0">
|
||||
<view class="empty-icon">
|
||||
<image src="/static/orderList.png" mode="aspectFill" class="empty-icon"></image>
|
||||
<image src="/static/orderList.png" mode="aspectFill" class="empty-icon" lazy-load="true"></image>
|
||||
</view>
|
||||
<text class="empty-text">{{ $t('order.noOrderRecord') }}</text>
|
||||
</view>
|
||||
|
||||
@@ -12,7 +12,7 @@
|
||||
<view class="order-list">
|
||||
<view class="empty-state" v-if="orderList.length === 0">
|
||||
<view class="empty-icon">
|
||||
<image src="/static/orderList.png" mode="aspectFill" class="empty-icon"></image>
|
||||
<image src="/static/orderList.png" mode="aspectFill" class="empty-icon" lazy-load="true"></image>
|
||||
</view>
|
||||
<text class="empty-text">{{ $t('order.noOrderRecord') }}</text>
|
||||
</view>
|
||||
|
||||
@@ -2,8 +2,8 @@
|
||||
<view class="my-page">
|
||||
<view class="user-card" @click="navigateTo('/pages/userProfile/index')">
|
||||
<view class="avatar-box">
|
||||
<image class="avatar" v-if="userInfo.avatar" :src="userInfo.avatar" mode="aspectFill"></image>
|
||||
<image v-else class="avatar" src="@/static/head.png" mode="aspectFill"></image>
|
||||
<image class="avatar" v-if="userInfo.avatar" :src="userInfo.avatar" mode="aspectFill" lazy-load="true"></image>
|
||||
<image v-else class="avatar" src="@/static/head.png" mode="aspectFill" lazy-load="true"></image>
|
||||
</view>
|
||||
<view class="user-text">
|
||||
<view class="nickname">{{ userInfo.nickName || $t('user.clickToLogin') }}</view>
|
||||
@@ -29,20 +29,20 @@
|
||||
<swiper class="banner-swiper" :indicator-dots="bannerImages.length > 1"
|
||||
:autoplay="bannerImages.length > 1" :circular="true" :interval="3000">
|
||||
<swiper-item v-for="(image, index) in bannerImages" :key="index">
|
||||
<image class="banner-image" :src="image" mode="aspectFill" @click="handleBannerClick(index)">
|
||||
<image class="banner-image" :src="image" mode="aspectFill" @click="handleBannerClick(index)" lazy-load="true">
|
||||
</image>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</view>
|
||||
<!-- 默认图片(当没有广告时显示) -->
|
||||
<view class="banner-card" v-else @click="navigateTo('/pages/join/index')">
|
||||
<image class="banner-image" src="/static/userCenter_swiper.png" mode="aspectFill"></image>
|
||||
<image class="banner-image" src="/static/userCenter_swiper.png" mode="aspectFill" lazy-load="true"></image>
|
||||
</view>
|
||||
<!-- <view class="section-title">常用服务</view> -->
|
||||
<view class="list">
|
||||
<view class="list-item" @click="handleQuickReturn">
|
||||
<view class="left">
|
||||
<image class="icon" src="/static/express_return.png" mode="aspectFit"></image>
|
||||
<image class="icon" src="/static/express_return.png" mode="aspectFit" lazy-load="true"></image>
|
||||
<text class="title">{{ $t('user.quickReturn') }}<text
|
||||
style="font-size: 18rpx;">{{ $t('user.quickReturnDesc') }}</text></text>
|
||||
</view>
|
||||
@@ -50,42 +50,42 @@
|
||||
</view>
|
||||
<view class="list-item" @click="navigateTo('/pages/expressReturn/index')" v-if="showMenuItem">
|
||||
<view class="left">
|
||||
<image class="icon" src="/static/express.png" mode="aspectFit"></image>
|
||||
<image class="icon" src="/static/express.png" mode="aspectFit" lazy-load="true"></image>
|
||||
<text class="title">{{ $t('user.expressReturn') }}</text>
|
||||
</view>
|
||||
<uv-icon name="arrow-right" size="16" color="#c8c8c8"></uv-icon>
|
||||
</view>
|
||||
<view class="list-item" @click="navigateTo('/subPackages/order/index')">
|
||||
<view class="left">
|
||||
<image class="icon" src="/static/orderList.png" mode="aspectFit"></image>
|
||||
<image class="icon" src="/static/orderList.png" mode="aspectFit" lazy-load="true"></image>
|
||||
<text class="title">{{ $t('user.myOrders') }}</text>
|
||||
</view>
|
||||
<uv-icon name="arrow-right" size="16" color="#c8c8c8"></uv-icon>
|
||||
</view>
|
||||
<view class="list-item" @click="navigateTo('/subPackages/user/my/card')">
|
||||
<view class="left">
|
||||
<image class="icon" src="/static/my_member.png" mode="aspectFit"></image>
|
||||
<image class="icon" src="/static/my_member.png" mode="aspectFit" lazy-load="true"></image>
|
||||
<text class="title">{{ $t('user.myCards') }}</text>
|
||||
</view>
|
||||
<uv-icon name="arrow-right" size="16" color="#c8c8c8"></uv-icon>
|
||||
</view>
|
||||
<view class="list-item" @click="navigateTo('/subPackages/user/my/coupon')">
|
||||
<view class="left">
|
||||
<image class="icon" src="/static/my_coupon.png" mode="aspectFit"></image>
|
||||
<image class="icon" src="/static/my_coupon.png" mode="aspectFit" lazy-load="true"></image>
|
||||
<text class="title">{{ $t('user.myCoupons') }}</text>
|
||||
</view>
|
||||
<uv-icon name="arrow-right" size="16" color="#c8c8c8"></uv-icon>
|
||||
</view>
|
||||
<view class="list-item" @click="navigateTo('/subPackages/service/help/index')">
|
||||
<view class="left">
|
||||
<image class="icon" src="/static/customer-service.png" mode="aspectFit"></image>
|
||||
<image class="icon" src="/static/customer-service.png" mode="aspectFit" lazy-load="true"></image>
|
||||
<text class="title">{{ $t('user.customerService') }}</text>
|
||||
</view>
|
||||
<uv-icon name="arrow-right" size="16" color="#c8c8c8"></uv-icon>
|
||||
</view>
|
||||
<view class="list-item" @click="navigateTo('/subPackages/service/feedback/index')">
|
||||
<view class="left">
|
||||
<image class="icon" src="/static/suggess.png" mode="aspectFit"></image>
|
||||
<image class="icon" src="/static/suggess.png" mode="aspectFit" lazy-load="true"></image>
|
||||
<text class="title">{{ $t('user.feedback') }}</text>
|
||||
</view>
|
||||
<uv-icon name="arrow-right" size="16" color="#c8c8c8"></uv-icon>
|
||||
@@ -99,14 +99,14 @@
|
||||
</view> -->
|
||||
<view class="list-item" @click="navigateTo('/subPackages/other/join/index')">
|
||||
<view class="left">
|
||||
<image class="icon" src="/static/peopleInWork.png" mode="aspectFit"></image>
|
||||
<image class="icon" src="/static/peopleInWork.png" mode="aspectFit" lazy-load="true"></image>
|
||||
<text class="title">{{ $t('user.cooperation') }}</text>
|
||||
</view>
|
||||
<uv-icon name="arrow-right" size="16" color="#c8c8c8"></uv-icon>
|
||||
</view>
|
||||
<view class="list-item" @click="navigateTo('/subPackages/user/setting/index')">
|
||||
<view class="left">
|
||||
<image class="icon" src="/static/setting.png" mode="aspectFit"></image>
|
||||
<image class="icon" src="/static/setting.png" mode="aspectFit" lazy-load="true"></image>
|
||||
<text class="title">{{ $t('user.settings') }}</text>
|
||||
</view>
|
||||
<uv-icon name="arrow-right" size="16" color="#c8c8c8"></uv-icon>
|
||||
|
||||
@@ -2,8 +2,8 @@
|
||||
<view class="profile-page">
|
||||
<view class="avatar-section">
|
||||
<view class="avatar-container">
|
||||
<image class="avatar" v-if="userInfo.avatar" :src="userInfo.avatar" mode="aspectFill"></image>
|
||||
<image v-else class="avatar" src="@/static/head.png" mode="aspectFill"></image>
|
||||
<image class="avatar" v-if="userInfo.avatar" :src="userInfo.avatar" mode="aspectFill" lazy-load="true"></image>
|
||||
<image v-else class="avatar" src="@/static/head.png" mode="aspectFill" lazy-load="true"></image>
|
||||
<!-- 覆盖在头像上的微信选择头像授权按钮,仅小程序生效 -->
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<button class="avatar-choose-btn" open-type="chooseAvatar" @chooseavatar="onChooseAvatar"></button>
|
||||
|
||||
Reference in New Issue
Block a user