fix: 🐛 优化 InputNumbe 处理中间状态值的逻辑，支持配置不立即响应输入变化 - #1116
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
✅ Deploy Preview for wot-design-uni ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
|
""" Walkthrough本次更新为 Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant InputNumber
participant Parent
User->>InputNumber: 输入/点击加减按钮
alt immediateChange = true
InputNumber->>Parent: 立即触发 change 事件
else immediateChange = false
InputNumber-->>User: 展示输入但不立即触发 change
User->>InputNumber: 失焦/点击按钮
InputNumber->>Parent: 此时触发 change 事件
end
Note over InputNumber: 初始化时<br>若 updateOnInit = true，自动校正初始值
Possibly related PRs
Poem
📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (6)
🚧 Files skipped from review as they are similar to previous changes (4)
🧰 Additional context used🧬 Code Graph Analysis (1)tests/components/wd-input-number.test.ts (1)
⏰ Context from checks skipped due to timeout of 90000ms (4)
✨ Finishing Touches
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. 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 (
|
组件测试摘要 (H5 平台)测试时间: Tue Jun 17 05:23:58 UTC 2025测试结果
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 4
🧹 Nitpick comments (3)
src/subPages/inputNumber/Index.vue (1)
198-288: 建议合并重复的 CSS 样式四个 demo 类（
.immediate-demo、.temp-empty-demo、.strict-bounds-demo、.format-init-demo）的样式基本相同，建议提取公共样式以减少代码重复。-<style lang="scss" scoped> -.flex { - display: flex; - justify-content: space-between; - align-items: center; -} - -.immediate-demo { - .demo-title { - font-size: 14px; - color: #333; - margin-bottom: 8px; - font-weight: 500; - } - - .demo-note { - font-size: 12px; - color: #999; - margin-top: 12px; - line-height: 1.4; - padding: 8px; - background: #f5f5f5; - border-radius: 4px; - } - - .wd-input-number { - margin-bottom: 16px; - } -} - -.temp-empty-demo { - .demo-description { - font-size: 14px; - color: #333; - margin-bottom: 8px; - font-weight: 500; - } - - .demo-note { - font-size: 12px; - color: #999; - margin-top: 12px; - line-height: 1.4; - padding: 8px; - background: #f5f5f5; - border-radius: 4px; - } - - .wd-input-number { - margin-bottom: 16px; - } -} - -.strict-bounds-demo { - .demo-description { - font-size: 14px; - color: #333; - margin-bottom: 8px; - font-weight: 500; - } - - .demo-note { - font-size: 12px; - color: #999; - margin-top: 12px; - line-height: 1.4; - padding: 8px; - background: #f5f5f5; - border-radius: 4px; - } - - .wd-input-number { - margin-bottom: 16px; - } -} - -.format-init-demo { - .demo-title { - font-size: 14px; - color: #333; - margin-bottom: 8px; - font-weight: 500; - } - - .demo-note { - font-size: 12px; - color: #999; - margin-top: 12px; - line-height: 1.4; - padding: 8px; - background: #f5f5f5; - border-radius: 4px; - } - - .wd-input-number { - margin-bottom: 16px; - } -} +<style lang="scss" scoped> +.flex { + display: flex; + justify-content: space-between; + align-items: center; +} + +.demo-wrapper { + .demo-title, + .demo-description { + font-size: 14px; + color: #333; + margin-bottom: 8px; + font-weight: 500; + } + + .demo-note { + font-size: 12px; + color: #999; + margin-top: 12px; + line-height: 1.4; + padding: 8px; + background: #f5f5f5; + border-radius: 4px; + } + + .wd-input-number { + margin-bottom: 16px; + } +} + +.immediate-demo, +.temp-empty-demo, +.strict-bounds-demo, +.format-init-demo { + @extend .demo-wrapper; +} </style>src/uni_modules/wot-design-uni/components/wd-input-number/wd-input-number.vue (2)
68-70:addStep判定冗余，始终返回 ≥ min
addStep调用normalizeValue后会再次 clamp 到min，因此
addStep(val, -props.step) < props.min恒为false。
可以直接判断val <= props.min以降低计算量并避免误读。
76-78: 同理，maxDisabled中的上界判定多余
addStep(val, props.step)经归一化后不会超过max。
保留val >= props.max即可。
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (6)
docs/component/input-number.md(3 hunks)docs/en-US/component/input-number.md(3 hunks)src/subPages/inputNumber/Index.vue(6 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(2 hunks)tests/components/wd-input-number.test.ts(1 hunks)
🧰 Additional context used
🧬 Code Graph Analysis (1)
tests/components/wd-input-number.test.ts (1)
src/uni_modules/wot-design-uni/components/wd-input-number/types.ts (1)
InputNumberProps(102-102)
🪛 GitHub Check: Test Components (wd-input-number)
tests/components/wd-input-number.test.ts
[failure] 705-705: tests/components/wd-input-number.test.ts > WdInputNumber > 无效初始值处理
AssertionError: expected '1' to be 'invalid' // Object.is equality
Expected: "invalid"
Received: "1"
❯ tests/components/wd-input-number.test.ts:705:30
[failure] 372-372: tests/components/wd-input-number.test.ts > WdInputNumber > 初始化时自动修正
AssertionError: expected [ '4' ] to deeply equal [ 4 ]
- Expected
-
Received
[
- 4,
- "4",
]
❯ tests/components/wd-input-number.test.ts:372:30
⏰ Context from checks skipped due to timeout of 90000ms (3)
- GitHub Check: Redirect rules - wot-design-uni
- GitHub Check: Header rules - wot-design-uni
- GitHub Check: Pages changed - wot-design-uni
🔇 Additional comments (3)
src/uni_modules/wot-design-uni/components/wd-input-number/types.ts (1)
10-10: 类型定义更新合理新增的
immediateChange和formatOnInit属性定义清晰，默认值设置得当。ExtractPropTypes的引入和InputNumberProps类型导出提升了类型安全性。Also applies to: 91-99, 102-102
docs/component/input-number.md (1)
207-208: 版本占位符需要替换
$LOWEST_VERSION$占位符需要在发布前替换为实际的版本号。docs/en-US/component/input-number.md (1)
207-208: Version placeholders need to be replacedThe
$LOWEST_VERSION$placeholders should be replaced with actual version numbers before release.
| const wrapper = createPropsOnlyWrapper({ | ||
| modelValue: 1, | ||
| min: 3, | ||
| max: 15, | ||
| step: 2, | ||
| stepStrictly: true, | ||
| formatOnInit: true | ||
| }) | ||
|
|
||
| await nextTick() | ||
|
|
||
| // 应该触发update:modelValue事件，将值从1修正为4 | ||
| const updateEvents = wrapper.emitted('update:modelValue') | ||
| expect(updateEvents).toBeTruthy() | ||
| expect(updateEvents![0]).toEqual([4]) | ||
| }) |
There was a problem hiding this comment.
测试用例失败：类型不匹配
第 372 行的测试期望 update:modelValue 事件发出数字 4，但实际发出的是字符串 '4'。这可能会导致类型不一致的问题。
建议确保组件始终发出正确类型的值。如果字符串是预期的，更新测试：
- expect(updateEvents![0]).toEqual([4])
+ expect(updateEvents![0]).toEqual(['4'])或者修复组件以确保发出数字类型。
📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| const wrapper = createPropsOnlyWrapper({ | |
| modelValue: 1, | |
| min: 3, | |
| max: 15, | |
| step: 2, | |
| stepStrictly: true, | |
| formatOnInit: true | |
| }) | |
| await nextTick() | |
| // 应该触发update:modelValue事件，将值从1修正为4 | |
| const updateEvents = wrapper.emitted('update:modelValue') | |
| expect(updateEvents).toBeTruthy() | |
| expect(updateEvents![0]).toEqual([4]) | |
| }) | |
| const wrapper = createPropsOnlyWrapper({ | |
| modelValue: 1, | |
| min: 3, | |
| max: 15, | |
| step: 2, | |
| stepStrictly: true, | |
| formatOnInit: true | |
| }) | |
| await nextTick() | |
| // 应该触发update:modelValue事件，将值从1修正为4 | |
| const updateEvents = wrapper.emitted('update:modelValue') | |
| expect(updateEvents).toBeTruthy() | |
| - expect(updateEvents![0]).toEqual([4]) | |
| + expect(updateEvents![0]).toEqual(['4']) | |
| }) |
🧰 Tools
🪛 GitHub Check: Test Components (wd-input-number)
[failure] 372-372: tests/components/wd-input-number.test.ts > WdInputNumber > 初始化时自动修正
AssertionError: expected [ '4' ] to deeply equal [ 4 ]
- Expected
-
Received
[
- 4,
- "4",
]
❯ tests/components/wd-input-number.test.ts:372:30
🤖 Prompt for AI Agents
In tests/components/wd-input-number.test.ts around lines 358 to 373, the test
expects the 'update:modelValue' event to emit a number 4, but it actually emits
a string '4', causing a type mismatch. To fix this, either update the test
expectation to expect a string '4' if that is intended behavior, or modify the
component code to ensure it emits a number type for the event value
consistently.
| test('无效初始值处理', async () => { | ||
| // 使用特殊的wrapper来处理无效值 | ||
| const WrapperComponent = defineComponent({ | ||
| components: { WdInputNumber }, | ||
| setup() { | ||
| const value = ref('invalid' as any) | ||
| return { | ||
| value, | ||
| min: 1, | ||
| stepStrictly: true | ||
| } | ||
| }, | ||
| template: '<WdInputNumber v-model="value" :min="min" :step-strictly="stepStrictly" />' | ||
| }) | ||
|
|
||
| const wrapper = mount(WrapperComponent) | ||
| await nextTick() | ||
|
|
||
| // 初始化时保持无效值 | ||
| expect(wrapper.vm.value).toBe('invalid') | ||
|
|
||
| // 用户交互时才会修正 - 模拟点击按钮 | ||
| await wrapper.findAll('.wd-input-number__action')[1].trigger('click') | ||
| await nextTick() | ||
|
|
||
| // 按钮操作后应该被修正为最小值 | ||
| expect(wrapper.vm.value).toBe(2) | ||
| }) |
There was a problem hiding this comment.
测试用例失败：无效初始值处理
根据测试失败信息，第 705 行的断言失败了。组件似乎将无效的初始值 'invalid' 转换为了 '1'。需要确认这是预期行为还是需要修复。
如果组件应该保留无效值直到用户交互，建议修改组件逻辑。如果这是预期行为，应该更新测试用例：
- // 初始化时保持无效值
- expect(wrapper.vm.value).toBe('invalid')
+ // 初始化时无效值被转换为数字
+ expect(wrapper.vm.value).toBe(1)📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| test('无效初始值处理', async () => { | |
| // 使用特殊的wrapper来处理无效值 | |
| const WrapperComponent = defineComponent({ | |
| components: { WdInputNumber }, | |
| setup() { | |
| const value = ref('invalid' as any) | |
| return { | |
| value, | |
| min: 1, | |
| stepStrictly: true | |
| } | |
| }, | |
| template: '<WdInputNumber v-model="value" :min="min" :step-strictly="stepStrictly" />' | |
| }) | |
| const wrapper = mount(WrapperComponent) | |
| await nextTick() | |
| // 初始化时保持无效值 | |
| expect(wrapper.vm.value).toBe('invalid') | |
| // 用户交互时才会修正 - 模拟点击按钮 | |
| await wrapper.findAll('.wd-input-number__action')[1].trigger('click') | |
| await nextTick() | |
| // 按钮操作后应该被修正为最小值 | |
| expect(wrapper.vm.value).toBe(2) | |
| }) | |
| test('无效初始值处理', async () => { | |
| // 使用特殊的wrapper来处理无效值 | |
| const WrapperComponent = defineComponent({ | |
| components: { WdInputNumber }, | |
| setup() { | |
| const value = ref('invalid' as any) | |
| return { | |
| value, | |
| min: 1, | |
| stepStrictly: true | |
| } | |
| }, | |
| template: '<WdInputNumber v-model="value" :min="min" :step-strictly="stepStrictly" />' | |
| }) | |
| const wrapper = mount(WrapperComponent) | |
| await nextTick() | |
| // 初始化时无效值被转换为数字 | |
| expect(wrapper.vm.value).toBe(1) | |
| // 用户交互时才会修正 - 模拟点击按钮 | |
| await wrapper.findAll('.wd-input-number__action')[1].trigger('click') | |
| await nextTick() | |
| // 按钮操作后应该被修正为最小值 | |
| expect(wrapper.vm.value).toBe(2) | |
| }) |
🧰 Tools
🪛 GitHub Check: Test Components (wd-input-number)
[failure] 705-705: tests/components/wd-input-number.test.ts > WdInputNumber > 无效初始值处理
AssertionError: expected '1' to be 'invalid' // Object.is equality
Expected: "invalid"
Received: "1"
❯ tests/components/wd-input-number.test.ts:705:30
🤖 Prompt for AI Agents
In tests/components/wd-input-number.test.ts between lines 686 and 713, the test
expects the component to keep the invalid initial value 'invalid' until user
interaction, but the component converts it to '1' immediately, causing the
assertion at line 705 to fail. Determine if the component's behavior of
correcting invalid initial values on mount is intended. If so, update the test
to expect '1' instead of 'invalid' initially. If not, modify the component logic
to preserve the invalid value until user interaction occurs.
| :style="`${inputWidth ? 'width: ' + inputWidth : ''}`" | ||
| type="digit" | ||
| type="number" | ||
| :input-mode="precision ? 'decimal' : 'numeric'" | ||
| :disabled="disabled || disableInput" |
There was a problem hiding this comment.
🛠️ Refactor suggestion
type="number" 可能导致小数与负数输入受限
在微信小程序与部分 H5 环境中，<input type="number"> 默认拦截 “.” 和 “-”，这会直接与组件支持小数 / 负数的诉求冲突，即使 input-mode="decimal" 也无法完全规避。
建议改回 type="text"，仅用 inputmode 控制键盘类型，并依赖现有 cleanInput 逻辑做格式校验。
🤖 Prompt for AI Agents
In src/uni_modules/wot-design-uni/components/wd-input-number/wd-input-number.vue
around lines 16 to 19, change the input element's type attribute from "number"
to "text" to avoid blocking decimal and negative inputs in some environments.
Keep using the inputmode attribute to control the keyboard type and rely on the
existing cleanInput logic for validating and formatting the input value.
Deploying wot-design-uni with
|
| Latest commit: |
bb8d30a
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://966fd255.wot-design-uni.pages.dev |
| Branch Preview URL: | https://feat-input-number-refactor.wot-design-uni.pages.dev |
|
Codecov ReportAttention: Patch coverage is
❗ Your organization needs to install the Codecov GitHub app to enable full functionality. Additional details and impacted files@@ Coverage Diff @@
## master #1116 +/- ##
==========================================
+ Coverage 84.92% 92.32% +7.40%
==========================================
Files 215 4 -211
Lines 17191 365 -16826
Branches 2743 111 -2632
==========================================
- Hits 14600 337 -14263
+ Misses 2591 28 -2563 Flags with carried forward coverage won't be shown. Click here to find out more. ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
组件测试摘要 (H5 平台)测试时间: Tue Jun 17 06:10:25 UTC 2025测试结果
|
There was a problem hiding this comment.
Actionable comments posted: 2
♻️ Duplicate comments (2)
src/uni_modules/wot-design-uni/components/wd-input-number/wd-input-number.vue (2)
17-19:type="number"会拦截小数点和负号，导致输入受限之前已指出同样问题：在微信小程序及部分 H5 环境下，
<input type="number">会直接屏蔽 “.” 与 “-”，即使inputmode="decimal"也无法完全绕过，破坏组件对小数 / 负数的支持。- type="number" + type="text"继续沿用
inputmode控制键盘类型，并依赖现有cleanInput逻辑做格式校验即可。
未修复会导致用户无法输入合法值。
236-240:isIntermediate逻辑过宽，整数被误判为中间态再次保留了
(precision>0 && str.indexOf('.')===-1)的判断，导致纯整数在设置precision时被视为“中间输入”，immediateChange无法生效。请按先前建议仅判断 “结尾/开头带小数点或单独负号”的情形。-return str.endsWith('.') || str.startsWith('.') || str.startsWith('-.') || str === '-' || (Number(props.precision) > 0 && str.indexOf('.') === -1) +return str.endsWith('.') || str.startsWith('.') || str.startsWith('-.') || str === '-'
🧹 Nitpick comments (2)
src/uni_modules/wot-design-uni/components/wd-input-number/wd-input-number.vue (1)
68-78: 允许空值时minDisabled/maxDisabled计算可能异常当
allowNull且当前inputValue为空，toNumber返回NaN，与任何比较均为false，导致按钮处于“可点击”状态；用户一点击即被强行修正为props.min/props.max，体验突兀。可在toNumber遇到NaN时直接返回当前modelValue或使用哨兵值并在计算中显式处理。tests/components/wd-input-number.test.ts (1)
115-122: 使用.attributes('value')获取输入值可能不可靠
input的value是 DOM 属性 而非属性节点，@vue/test-utils在某些环境下不会同步到attributes。为避免潜在误判，建议改为：const inputEl = wrapper.find('.wd-input-number__input').element as HTMLInputElement expect(inputEl.value).toBe('5')能确保跨环境一致性。
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (2)
src/uni_modules/wot-design-uni/components/wd-input-number/wd-input-number.vue(2 hunks)tests/components/wd-input-number.test.ts(1 hunks)
🧰 Additional context used
🧬 Code Graph Analysis (1)
tests/components/wd-input-number.test.ts (1)
src/uni_modules/wot-design-uni/components/wd-input-number/types.ts (1)
InputNumberProps(102-102)
⏰ Context from checks skipped due to timeout of 90000ms (2)
- GitHub Check: ESLint Check
- GitHub Check: Cloudflare Pages
🔇 Additional comments (1)
tests/components/wd-input-number.test.ts (1)
358-373: 初始化自动修正用例已匹配新逻辑 ✅该测试现期待数值
4（number），与组件update:modelValue的实际输出一致，解决了此前的类型不一致问题。
组件测试摘要 (H5 平台)测试时间: Sat Jun 21 10:16:15 UTC 2025测试结果
|
There was a problem hiding this comment.
Actionable comments posted: 1
♻️ Duplicate comments (5)
tests/components/wd-input-number.test.ts (2)
358-373: 测试用例存在类型不匹配问题根据过往评审意见，此处测试期望
update:modelValue事件发出数字4，但实际发出的是字符串'4'。这与组件的实际行为不一致。需要确认组件的预期行为并修正测试：
- expect(updateEvents![0]).toEqual([4]) + expect(updateEvents![0]).toEqual(['4'])或者修复组件确保发出正确的数字类型。
686-705: 无效初始值处理测试与组件行为不符根据过往评审意见，测试期望保留无效初始值
'invalid'直到用户交互，但组件立即将其转换为'1'。这表明测试假设与组件实际行为不一致。需要明确组件对无效初始值的处理策略：
- // 初始化时保持无效值 - expect(wrapper.vm.value).toBe('invalid') + // 初始化时无效值被转换为最小值 + expect(wrapper.vm.value).toBe(1)src/uni_modules/wot-design-uni/components/wd-input-number/wd-input-number.vue (3)
17-18: 输入类型设置可能导致小数和负数输入问题根据过往评审意见，
type="number"在微信小程序和部分 H5 环境中可能阻止小数点和负号输入，即使设置了input-mode="decimal"也无法完全解决。建议改为
type="text"并依赖现有的cleanInput逻辑：- type="number" + type="text" :input-mode="precision ? 'decimal' : 'numeric'"
132-154: toNumber 函数的边界处理可能导致用户体验问题根据过往评审意见，将所有非法输入直接归为
props.min可能导致用户输入的突然跳变，特别是当用户输入接近上限时。建议改进非法值处理逻辑：
function toNumber(val: string | number): number { // 空值处理 if (props.allowNull && (!isDef(val) || val === '')) { return NaN } if (!isDef(val) || val === '') { - return props.min + // 保持当前值不变，避免意外跳变 + return isNaN(Number(props.modelValue)) ? props.min : Number(props.modelValue) } let str = String(val) // 处理中间输入状态 if (str.endsWith('.')) str = str.slice(0, -1) if (str.startsWith('.')) str = '0' + str if (str.startsWith('-.')) str = '-0' + str.substring(1) - if (str === '-' || str === '') return props.min + if (str === '-' || str === '') { + return isNaN(Number(props.modelValue)) ? props.min : Number(props.modelValue) + } let num = Number(str) - if (isNaN(num)) num = props.min + if (isNaN(num)) { + // 返回当前值或最小值，避免突然跳变 + return isNaN(Number(props.modelValue)) ? props.min : Number(props.modelValue) + } return normalizeValue(num) }
235-239: isIntermediate 函数逻辑过于宽泛根据过往评审意见，当
precision > 0时，纯整数如123也被当作中间状态，这会阻止updateValue调用，导致immediateChange失效。建议修正逻辑，只将真正的中间状态视为中间输入：
function isIntermediate(val: string): boolean { if (!val) return false const str = String(val) - return str.endsWith('.') || str.startsWith('.') || str.startsWith('-.') || str === '-' || (Number(props.precision) > 0 && str.indexOf('.') === -1) + return str.endsWith('.') || str.startsWith('.') || str.startsWith('-.') || str === '-' }
🧹 Nitpick comments (3)
tests/components/wd-input-number.test.ts (2)
7-70: 辅助函数设计良好，但可以进一步优化类型安全性辅助函数
createWrapper设计得很好，支持动态 props 修改。不过建议改进类型定义以提高类型安全性。-function createWrapper(props: Partial<InputNumberProps> = {}, vModelValue: number | string = 1) { +function createWrapper(props: Partial<InputNumberProps> = {}, vModelValue: number | string = 1): VueWrapper<any> {同时，建议为组件 props 添加更严格的类型验证：
- props: { + props: { // 定义所有可能的props，这样可以通过setProps动态修改 - modelValue: { type: [Number, String], default: undefined }, + modelValue: { type: [Number, String] as PropType<number | string>, default: undefined },
85-102: 辅助函数实现合理，建议增强错误处理
simulateInput和simulateBlur函数直接调用组件方法，这种方式合理且高效。不过建议增加错误处理以提高测试的健壮性。async function simulateInput(wrapper: any, value: string) { // 直接调用组件的handleInput方法 const component = wrapper.findComponent(WdInputNumber) if (component.exists()) { - component.vm.handleInput(createInputEvent(value)) + try { + component.vm.handleInput(createInputEvent(value)) + } catch (error) { + console.warn('simulateInput error:', error) + } } await nextTick() }src/uni_modules/wot-design-uni/components/wd-input-number/wd-input-number.vue (1)
338-369: 输入处理逻辑实现合理，支持即时和延迟更新输入处理函数很好地实现了即时更新和延迟更新的双重模式，中间状态处理也比较合理。不过建议优化空值处理逻辑。
建议优化空值处理的判断条件：
// 空值处理 if (rawVal === '') { inputValue.value = '' - if (props.immediateChange && props.allowNull) { + if (props.immediateChange) { + if (props.allowNull) { updateValue('') + } else { + // 非允许空值时，可考虑延迟处理或保持当前值 + } } return }
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (6)
docs/component/input-number.md(3 hunks)docs/en-US/component/input-number.md(3 hunks)src/subPages/inputNumber/Index.vue(6 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(2 hunks)tests/components/wd-input-number.test.ts(1 hunks)
🚧 Files skipped from review as they are similar to previous changes (4)
- src/uni_modules/wot-design-uni/components/wd-input-number/types.ts
- docs/en-US/component/input-number.md
- docs/component/input-number.md
- src/subPages/inputNumber/Index.vue
⏰ Context from checks skipped due to timeout of 90000ms (1)
- GitHub Check: Test Components (wd-input-number)
🔇 Additional comments (4)
tests/components/wd-input-number.test.ts (1)
950-1119: 测试覆盖度很高，边界情况处理得当这些边界情况测试很全面，包括负数步进、小数精度累积误差、极端值稳定性等。测试设计考虑周到，能够有效验证组件的健壮性。
特别赞赏的测试场景：
- 小数精度累积误差处理 (lines 976-993)
- 极端值下的稳定性 (lines 910-927)
- 组件清理逻辑 (lines 930-949)
src/uni_modules/wot-design-uni/components/wd-input-number/wd-input-number.vue (3)
184-214: 严格步进边界处理实现良好
applyStrictBounds函数实现了复杂的严格步进边界逻辑，考虑了最小值和最大值的约束，代码逻辑清晰合理。实现亮点：
- 正确处理了精度计算避免浮点误差
- 合理的候选值回退机制
- 边界情况的完整覆盖
314-322: 步进计算函数设计优秀
addStep函数很好地处理了浮点精度问题，使用因子计算避免了 JavaScript 浮点运算的精度误差。实现思路值得赞赏。技术亮点：
- 动态精度计算
- 因子法避免浮点误差
- 标准化处理确保结果合规
276-309: updateValue 函数实现了完整的事件流程函数很好地整合了值更新、事件发射和拦截器调用，支持了新的
beforeChange拦截器功能。代码结构清晰，逻辑完整。设计优点：
- 完整的空值处理
- 拦截器模式支持
- 事件发射的一致性
- 值比较避免不必要的更新
组件测试摘要 (H5 平台)测试时间: Sun Jun 22 03:29:51 UTC 2025测试结果
|
2 participants
🤔 这个 PR 的性质是？(至少选择一个)
🔗 相关 Issue
相关功能需求和用户反馈，主要解决InputNumber组件在使用过程中缺少的细粒度控制功能。
💡 需求背景和解决方案
需求背景
InputNumber组件在实际使用中存在以下需求：
解决方案
1. 新增更新模式控制
2. 新增初始化行为控制
API 实现
新增属性：
immediate-change: boolean- 是否立即响应输入变化，默认trueformat-on-init: boolean- 是否在初始化时自动修正值到有效范围，默认trueTypeScript类型定义：
功能演示
新增了以下演示用例：
☑️ 请求合并前的自查清单
Summary by CodeRabbit
新功能
文档
测试