feat(imagepreview): use nutui image #2793
Conversation
Walkthrough此次更改主要涉及 Changes
Possibly related PRs
Suggested labels
Suggested reviewers
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## feat_v3.x #2793 +/- ##
==========================================
Coverage 83.99% 83.99%
==========================================
Files 220 220
Lines 17885 17885
Branches 2679 2679
==========================================
Hits 15023 15023
Misses 2857 2857
Partials 5 5 ☔ View full report in Codecov by Sentry. |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Outside diff range and nitpick comments (1)
src/packages/imagepreview/imagepreview.scss (1)
80-86: 样式实现合理，建议添加注释说明新增的样式使用 flex 布局来实现内容居中，实现方式符合最佳实践。建议添加注释说明样式的用途，以提高代码可维护性。
建议添加如下注释：
.nut-image, .nut-video { + // 使用 flex 布局实现内容水平垂直居中 display: flex; justify-content: center; align-items: center; }
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
📒 Files selected for processing (2)
src/packages/imagepreview/imagepreview.scss(1 hunks)src/packages/imagepreview/imagepreview.taro.tsx(1 hunks)
🔇 Additional comments (3)
src/packages/imagepreview/imagepreview.taro.tsx (3)
Line range hint 91-157: 建议全面测试图片缩放功能
由于更换了底层 Image 组件的实现，请重点测试以下场景：
- 双指缩放手势的响应性
- 双击放大/缩小功能
- 缩放过程中的性能表现
- 边界条件下的行为（最大/最小缩放比例）
Line range hint 313-328: 图片预览实现符合预期 ✨
代码实现合理：
- 正确处理了平台特定属性（showMenuByLongpress）
- 保持了与原有功能的一致性
- 图片样式设置适当
10-10: 请验证 NutUI Image 组件 API 兼容性
从 @tarojs/components 切换到 NutUI 的 Image 组件是一个重要改动。建议：
- 确认新的 Image 组件支持所有必需的属性（mode、showMenuByLongpress 等）
- 验证在各类设备和场景下的兼容性
Also applies to: 14-14
✅ Verification successful
NutUI Image 组件 API 兼容性已确认
经过验证，NutUI Image 组件完全支持当前场景所需的功能：
- 在 imagepreview.taro.tsx 中，Image 组件仅使用了
src、mode和基础样式属性 - NutUI Image 组件（image.taro.tsx）继承了 Taro Image 的所有属性（通过
Omit<TImageProps, 'style'>） - 组件使用方式符合预期，不会影响现有功能
🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash
# 检查 NutUI Image 组件的 API 定义
ast-grep --pattern 'interface $ImageProps {
$$$
}'
Length of output: 54
Script:
#!/bin/bash
# 搜索 Image 组件的属性定义和使用方式
rg -A 10 "type ImageProps" src/packages/image/
rg -A 10 "interface ImageProps" src/packages/image/
# 检查 ImagePreview 中 Image 组件的使用
rg -A 5 "Image" src/packages/imagepreview/imagepreview.taro.tsx
# 检查原始 Taro Image 组件的使用方式
rg -A 5 "Image.*from.*@tarojs/components"
Length of output: 11454
|
1、关闭按钮icon svg 色值不对 2、设置初始页码打开滑动在关闭，展示图片不对 |
Summary by CodeRabbit
新功能
改进