fix(images): 修正图片展示模式为aspectFit
- 将商品分类页图片组件的mode属性从aspectFill改为aspectFit - 修改首页图片组件的mode属性以保持图片完整显示 - 防止图片裁剪,提升图片展示效果一致性
This commit is contained in:
8
.workbuddy/memory/2026-07-09.md
Normal file
8
.workbuddy/memory/2026-07-09.md
Normal file
@@ -0,0 +1,8 @@
|
|||||||
|
# 2026-07-09 工作日志
|
||||||
|
|
||||||
|
## 图片 mode 修复
|
||||||
|
- 修复商品图片显示不全的问题:将 `Image` 组件的 `mode` 从 `aspectFill` 改为 `aspectFit`(保持纵横比缩放,完整显示图片,不裁剪)。
|
||||||
|
- 涉及页面:
|
||||||
|
- `src/pages/index/index.tsx`(首页热销商品)
|
||||||
|
- `src/pages/shop/category.tsx`(分类页商品列表)
|
||||||
|
- `src/pages/shop/index.tsx`(购物商城页面,用户后续反馈此页面也未修改)
|
||||||
@@ -271,7 +271,7 @@ const ShopPage: React.FC = () => {
|
|||||||
<Image
|
<Image
|
||||||
className='w-full h-full'
|
className='w-full h-full'
|
||||||
src={getCompressedImageUrl(item.image || item.files || '')}
|
src={getCompressedImageUrl(item.image || item.files || '')}
|
||||||
mode='aspectFill'
|
mode='aspectFit'
|
||||||
lazyLoad
|
lazyLoad
|
||||||
/>
|
/>
|
||||||
</View>
|
</View>
|
||||||
|
|||||||
Reference in New Issue
Block a user