<view class="just-product">
<view class="just-product-left">
<view class="just-product-item" v-for="(item,index) in RecommendPrudct[0]" :key="index" @click="toProductInfo(item.Id)">
<image class="just-product-img" :src="item.DefaultPictureModel.FullSizeImageUrl" lazy-load mode="aspectFit"></image>
<view class="just-product-info">
<text class="just-product-name">{{item.Name}}</text>
<view class="price-car">
<text class="just-product-price">{{item.AddToCart.CustomerEnteredPriceRange}}{{item.ProductPrice.Price}}</text>
<view class="just-product-car">
<image class="just-product-car-img" src="~@/static/cart.png"></image>
</view>
</view>
</view>
</view>
</view>
<view class="just-product-right">
<view class="just-product-item" v-for="(item,index) in RecommendPrudct[1]" :key="index" @click="toProductInfo(item.Id)">
<image class="just-product-img" :src="item.DefaultPictureModel.FullSizeImageUrl" lazy-load mode="aspectFit"></image>
<view class="just-product-info">
<text class="just-product-name">{{item.Name}}</text>
<view class="price-car">
<text class="just-product-price">{{item.AddToCart.CustomerEnteredPriceRange}}{{item.ProductPrice.Price}}</text>
<view class="just-product-car">
<image class="just-product-car-img" src="~@/static/cart.png"></image>
</view>
</view>
</view>
</view>
</view>
</view>
- 发布:2020-11-16 15:38
- 更新:2022-11-08 16:05
- 阅读:1206
产品分类: uniapp/App
PC开发环境操作系统: Windows
PC开发环境操作系统版本号: win10
HBuilderX类型: 正式
HBuilderX版本号: 2.9.8
手机系统: Android
手机系统版本号: Android 10
手机厂商: 一加
手机机型: 一加6,一加8t
页面类型: nvue
打包方式: 云端
项目创建方式: HBuilderX
示例代码:
操作步骤:
···
···
预期结果:
···
···
实际结果:
···
···
疑似手机内存爆了,尝试重启手机看看是否仍然复现。
优化建议1.用nvue的list组件有内存回收机制。2显示缩略图不要显示大图。
如果是unicloud阿里云版可以使用
OSS图片支持拼接url实现图片缩略图,配置如下:
按百分比缩放:
?x-oss-process=image/resize,p_12
将原图指定按短边缩略 100x100
?x-oss-process=image/resize,m_lfit,h_200,w_200
例子:
http://image-demo.oss-cn-hangzhou.aliyuncs.com/example.jpg?x-oss-process=image/resize,m_lfit,h_200,w_200
1***@qq.com (作者)
改用list组件,问题一样
2020-11-16 16:43
1***@qq.com (作者)
可以了,list加小图显示
2020-11-16 16:48