feat: ✨ 新增 InputNumber 组件支持长按加减功能 #910
Open
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
Walkthrough本次变更主要针对 Changes
Sequence Diagram(s)sequenceDiagram
participant U as 用户
participant B as 按钮
participant C as wd-input-number组件
U->>B: 按下按钮
B->>C: 触发 touchstart 事件
C->>C: 执行 handleTouchStart()，启动计时器
loop 长按期间
C->>C: 执行 handleClick('add' / 'sub')
end
U->>B: 松开按钮
B->>C: 触发 touchend 事件
C->>C: 调用 clearlongPressTimer() 清除计时器
Possibly related PRs
Suggested reviewers
Poem
✨ Finishing Touches
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 (
|
✅ Deploy Preview for wot-design-uni ready!Built without sensitive environment variables
To edit notification comments on pull requests, go to your Netlify site configuration. |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (2)
src/uni_modules/wot-design-uni/components/wd-input-number/wd-input-number.vue (2)
250-257: 建议优化长按定时器间隔当前长按加减的时间间隔固定为 250ms，建议将此值作为可配置项，以便根据不同场景调整响应速度。
+const LONG_PRESS_INTERVAL = 250 // ms function longPressStep(type: OperationType) { clearlongPressTimer() longPressTimer = setTimeout(() => { handleClick(type) longPressStep(type) - }, 250) + }, LONG_PRESS_INTERVAL) }
259-267: 建议优化长按触发时间当前长按触发的延迟时间固定为 600ms，建议将此值作为可配置项，以提供更灵活的用户体验。
+const LONG_PRESS_DELAY = 600 // ms function handleTouchStart(type: OperationType) { if (!props.longPress) return clearlongPressTimer() longPressTimer = setTimeout(() => { handleClick(type) longPressStep(type) - }, 600) + }, LONG_PRESS_DELAY) }
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (4)
docs/component/input-number.md(4 hunks)src/pages/inputNumber/Index.vue(3 hunks)src/uni_modules/wot-design-uni/components/wd-input-number/types.ts(2 hunks)src/uni_modules/wot-design-uni/components/wd-input-number/wd-input-number.vue(5 hunks)
🧰 Additional context used
🧠 Learnings (1)
docs/component/input-number.md (1)
Learnt from: chen-ziwen
PR: Moonofweisheng/wot-design-uni#909
File: docs/component/input-number.md:93-98
Timestamp: 2025-02-20T12:31:40.241Z
Learning: In the InputNumber component documentation, function naming should be consistent across all examples, using `handleChange` instead of variations like `handleChange1`.
🔇 Additional comments (7)
src/uni_modules/wot-design-uni/components/wd-input-number/types.ts (2)
20-20: 类型定义清晰简洁！
OperationType类型定义明确地限制了操作类型为 'add' 或 'sub'，有助于类型安全。
101-105: 属性文档完整！
longPress属性的类型定义和默认值设置合理，文档注释清晰地说明了属性的用途。src/pages/inputNumber/Index.vue (2)
39-41: 示例代码结构规范！新增的长按加减示例遵循了现有的代码结构和命名规范。
61-61: 处理函数实现统一！
value12和handleChange12的实现与其他示例保持一致，便于理解和维护。Also applies to: 90-92
src/uni_modules/wot-design-uni/components/wd-input-number/wd-input-number.vue (2)
4-11: 事件处理逻辑优化！减号和加号按钮的事件处理进行了统一，使用
handleClick方法处理点击事件，同时添加了长按事件的支持，代码结构更加清晰。Also applies to: 29-36
233-237: 统一的操作处理函数实现清晰！
handleClick函数通过OperationType类型参数统一处理加减操作，实现简洁且易于维护。docs/component/input-number.md (1)
127-133: 文档示例清晰完整！新增的长按加减功能文档结构清晰，示例代码简洁易懂。
Moonofweisheng
force-pushed
the
master
branch
from
9880aeb to
b1e1db3
Compare
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
🤔 这个 PR 的性质是？(至少选择一个)
🔗 相关 Issue
无
💡 需求背景和解决方案
添加
longPress属性用于长按控制加减，项目中需要用到这个功能。☑️ 请求合并前的自查清单
Summary by CodeRabbit
新功能
文档