feat(trendarrow): 多端适配 #2540
feat(trendarrow): 多端适配 #2540
Conversation
Walkthrough此次更改更新了 Changes
Possibly related PRs
Suggested labels
Suggested reviewers
Poem
📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (1)
🚧 Files skipped from review as they are similar to previous changes (1)
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 (
|
![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/config.json (1)
需要补充破坏性变更文档
根据检查结果，虽然在 CHANGELOG.md 中有记录优化 TrendArrow 组件的 props (#1150)，但从 2.0.0 升级到 3.0.0 的破坏性变更并未详细说明。建议：
- 在 CHANGELOG.md 中补充 3.0.0 版本的破坏性变更说明
- 详细列出不兼容的 API 修改内容
- 提供升级指南，帮助用户从 2.0.0 迁移到 3.0.0
🔗 Analysis chain
Line range hint
1210-1218: 版本号更新需要确认破坏性变更文档版本号从 2.0.0 升级到 3.0.0 表明存在破坏性变更。根据语义化版本规范，主版本号的变更意味着不向下兼容的 API 修改。
请确认以下内容：
- 是否已更新 CHANGELOG.md 文档
- 是否已在文档中说明不兼容的变更
Let's check the content of CHANGELOG.md to verify if breaking changes are documented.
Let's check for any recent commits or PRs related to TrendArrow to understand the breaking changes better.
Let's check the actual PR content to understand the changes better.
🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # 检查是否存在 CHANGELOG 或升级指南文档 echo "查找 CHANGELOG 和升级指南文档..." fd -t f -e md -e MD "CHANGELOG|UPGRADING|MIGRATION"Length of output: 123
Script:
#!/bin/bash # 检查 CHANGELOG.md 中关于 TrendArrow 组件的最新变更记录 echo "检查 CHANGELOG.md 中的 TrendArrow 相关内容..." rg -A 5 -B 5 "TrendArrow|趋势箭头" CHANGELOG.mdLength of output: 519
Script:
#!/bin/bash # 检查最近的提交记录中关于 TrendArrow 的变更 echo "检查最近的 TrendArrow 相关提交..." git log --grep="TrendArrow\|趋势箭头" -n 5 --pretty=format:"%h %s" # 检查组件源文件的变更历史 echo -e "\n\n检查 TrendArrow 组件文件的变更历史..." fd -t f "TrendArrow" -x git log -p -n 1 {}Length of output: 325
Script:
#!/bin/bash # 查找 TrendArrow 组件的源文件 echo "查找 TrendArrow 组件文件..." fd "TrendArrow" -t f # 检查组件的具体实现 echo -e "\n检查组件实现..." ast-grep --pattern 'export $_ class TrendArrow { $$$ }'Length of output: 168
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## V3.0 #2540 +/- ##
=======================================
Coverage 83.95% 83.95%
=======================================
Files 221 221
Lines 17849 17849
Branches 2679 2679
=======================================
Hits 14986 14986
Misses 2858 2858
Partials 5 5 ☔ View full report in Codecov by Sentry. |
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Outside diff range and nitpick comments (1)
src/packages/trendarrow/trendarrow.taro.tsx (1)
119-135: 优化条件渲染逻辑当前实现存在以下问题：
- 使用了不必要的Fragment包裹
- 条件渲染逻辑可以更简洁
建议简化实现：
- <> - {riseIcon || - (harmonyAndRn() ? ( - <Text>⬆️</Text> - ) : ( - <TriangleUp color={calcIconProps.color} /> - ))} - </> + {riseIcon || ( + harmonyAndRn() ? ( + <Text>⬆️</Text> + ) : ( + <TriangleUp color={calcIconProps.color} /> + ) + )}同样的优化也适用于降序图标的渲染逻辑。
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
📒 Files selected for processing (1)
src/packages/trendarrow/trendarrow.taro.tsx(3 hunks)
🧰 Additional context used
🪛 Biome
src/packages/trendarrow/trendarrow.taro.tsx
[error] 118-139: Avoid using unnecessary Fragment.
A fragment is redundant if it contains only one child, or if it is the child of a html element, and is not a keyed fragment.
Unsafe fix: Remove the Fragment
(lint/complexity/noUselessFragments)
🔇 Additional comments (3)
src/packages/trendarrow/trendarrow.taro.tsx (3)
3-3: 导入Taro组件以支持多端适配
引入@tarojs/components中的View和Text组件是正确的做法，这符合Taro框架的最佳实践。
101-106: 正确使用了Taro的基础组件
将HTML元素替换为Taro的View和Text组件是正确的改动，这样可以确保在各端表现一致。
Also applies to: 110-114
121-122: 验证emoji在不同平台的兼容性
使用emoji作为图标替代方案需要确保在所有目标平台上都能正确显示。
需要我帮您编写相关的平台兼容性测试用例吗？
Also applies to: 130-131
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Outside diff range and nitpick comments (1)
src/packages/trendarrow/trendarrow.taro.tsx (1)
Line range hint
117-122: 需要回退图标实现根据之前的讨论，当前的图标实现需要等待Icon适配后再进行修改。建议暂时回退这部分改动。
建议暂时使用以下实现：
- {rateTrend.current ? ( - <>{riseIcon || <TriangleUp color={calcIconProps.color} />}</> - ) : ( - <>{dropIcon || <TriangleDown color={calcIconProps.color} />}</> - )} + // TODO: 等待Icon适配后再实现 + <Text>{rateTrend.current ? '↑' : '↓'}</Text>
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
📒 Files selected for processing (1)
src/packages/trendarrow/trendarrow.taro.tsx(4 hunks)
🧰 Additional context used
📓 Learnings (1)
src/packages/trendarrow/trendarrow.taro.tsx (1)
Learnt from: oasis-cloud
PR: jdf2e/nutui-react#2540
File: src/packages/trendarrow/trendarrow.taro.tsx:29-30
Timestamp: 2024-11-06T02:16:07.069Z
Learning: 在`TrendArrow`组件（`src/packages/trendarrow/trendarrow.taro.tsx`）中，CSS变量在鸿蒙系统（Harmony OS）中可能未被完全支持，导致兼容性问题。因此，使用硬编码的十六进制颜色值可以确保在鸿蒙系统上的正确显示。
🔇 Additional comments (2)
src/packages/trendarrow/trendarrow.taro.tsx (2)
3-3: 导入和颜色定义的修改符合要求
- 新增的Taro组件导入确保了多端兼容性
- 使用十六进制颜色值而不是CSS变量的修改是正确的，这样可以确保在鸿蒙系统上正常显示
Also applies to: 28-29
100-105: 组件结构调整合理
使用View和Text替换原有的HTML元素是正确的改动，这确保了组件在多端环境下的一致性表现。
Also applies to: 109-113
done |
|
1、自定义icon 可以支持了 |
已调整 |
icon已进行占位处理
Summary by CodeRabbit
新功能
TrendArrow组件的版本到 3.0.0，表示潜在的增强或新功能。riseColor和dropColor根据条件使用具体的颜色十六进制值。样式改进
.nut-trendarrow类的布局样式，优化响应式表现。