Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(inputnumber): 增加 beforeChange,优化异步逻辑 #3006

Open
wants to merge 1 commit into
base: feat_v3.x
Choose a base branch
from

Conversation

oasis-cloud
Copy link
Collaborator

@oasis-cloud oasis-cloud commented Feb 20, 2025

Summary by CodeRabbit

  • 新功能
    • 引入异步预处理回调功能(beforeChange),在输入变更前对数值进行异步校验和处理,提升了交互反馈。
    • 扩大了数字输入范围(如将最小值从 -6 调整为 -9999),满足更多业务需求。
  • 文档更新
    • 更新了组件文档,新增说明新属性及更新的样式变量,为用户提供更多自定义调整选项。

Copy link

coderabbitai bot commented Feb 20, 2025

Walkthrough

此次变更主要围绕 InputNumber 组件的异步事件处理能力的改进。测试文件中增加了 async/await 及 act 包裹以确保事件处理正确执行;演示文件中用新的 beforeChange 替换了 onChange 方法,实现延时预处理和更广数值范围;文档则更新了属性说明,CSS 变量值及新增了圆角属性;组件实现文件移除了 async 属性,并将相关函数改为异步,优化了数值更新逻辑。

Changes

文件 修改内容
src/packages/inputnumber/__tests__/inputnumber.spec.tsx 为多处 fireEvent 包裹 async/await act,调整断言方法从 toBeCalled()toHaveBeenCalled()
src/packages/inputnumber/demos/h5/demo8.tsx
src/packages/inputnumber/demos/taro/demo8.tsx
替换 onChange 为 beforeChange 实现异步预处理,更新 min 属性至 -9999(Taro demo 中移除 Cell 组件及命名修正)。
src/packages/inputnumber/doc*.md
(包括 doc.en-US.md, doc.md, doc.taro.md, doc.zh-TW.md)
文档更新:标记 async 为弃用,添加 beforeChange 属性,更新 select 属性版本说明,并调整 CSS 变量(包括新增按钮圆角)。
src/packages/inputnumber/inputnumber.taro.tsx
src/packages/inputnumber/inputnumber.tsx
实现改进:添加 beforeChange 属性,移除 async 属性,将 update、handleReduce、handlePlus、handleInputChange 等函数改为异步,更新 onChange 方法签名及格式化逻辑。

Sequence Diagram(s)

sequenceDiagram
  participant U as 用户
  participant IN as InputNumber 组件
  participant BC as beforeChange 回调
  participant ST as 状态更新

  U->>IN: 发起输入或点击事件
  IN->>BC: 调用 beforeChange 检查
  BC-->>IN: 返回 Boolean/Promise 结果
  alt 检查通过
      IN->>ST: 更新输入值并触发 onChange
  else 检查失败
      IN-->>U: 保持原值,不执行更新
  end
Loading

Possibly related PRs

Suggested reviewers

  • xiaoyatong
  • Alex-huxiyang

Poem

小兔跳跃在代码间,
异步预处理轻松先。
测试加 await 不打盹,
文档更新画新篇。
活力满满稳步前进 🐰✨


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?

❤️ Share
🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

  • Review comments: Directly reply to a review comment made by CodeRabbit. Example:
    • I pushed a fix in commit <commit_id>, please review it.
    • Generate unit testing code for this file.
    • Open a follow-up GitHub issue for this discussion.
  • Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
    • @coderabbitai generate unit testing code for this file.
    • @coderabbitai modularize this function.
  • PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
    • @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
    • @coderabbitai read src/utils.ts and generate unit testing code.
    • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
    • @coderabbitai help me debug CodeRabbit configuration file.

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)

  • @coderabbitai pause to pause the reviews on a PR.
  • @coderabbitai resume to resume the paused reviews.
  • @coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
  • @coderabbitai full review to do a full review from scratch and review all the files again.
  • @coderabbitai summary to regenerate the summary of the PR.
  • @coderabbitai generate docstrings to generate docstrings for this PR. (Beta)
  • @coderabbitai resolve resolve all the CodeRabbit review comments.
  • @coderabbitai configuration to show the current CodeRabbit configuration for the repository.
  • @coderabbitai help to get help.

Other keywords and placeholders

  • Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
  • Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
  • Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (.coderabbit.yaml)

  • You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
  • Please see the configuration documentation for more information.
  • If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Documentation and Community

  • Visit our Documentation for detailed information on how to use CodeRabbit.
  • Join our Discord Community to get help, request features, and share feedback.
  • Follow us on X/Twitter for updates and announcements.

@github-actions github-actions bot added action:review This PR needs more reviews (less than 2 approvals) 3.x Target branch 3.x labels Feb 20, 2025
Copy link

codecov bot commented Feb 20, 2025

Codecov Report

Attention: Patch coverage is 98.00000% with 1 line in your changes missing coverage. Please review.

Project coverage is 85.90%. Comparing base (a5014bf) to head (adf3f0f).

Files with missing lines Patch % Lines
src/packages/inputnumber/inputnumber.tsx 98.00% 1 Missing ⚠️
Additional details and impacted files
@@              Coverage Diff              @@
##           feat_v3.x    #3006      +/-   ##
=============================================
+ Coverage      85.79%   85.90%   +0.10%     
=============================================
  Files            281      281              
  Lines          18527    18493      -34     
  Branches        2810     2806       -4     
=============================================
- Hits           15896    15886      -10     
+ Misses          2626     2602      -24     
  Partials           5        5              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 0

🧹 Nitpick comments (8)
src/packages/inputnumber/inputnumber.tsx (3)

128-158: 异步函数 update 逻辑清晰,但可优化类型声明。
当前 calcNextValue 的实参类型均为 any,可能影响可读性和可维护性。

可在函数定义中增加更具体的类型:

- const calcNextValue = (current: any, stepValue: any, symbol: number) => {
+ const calcNextValue = (current: number | null | string, stepValue: number | string, symbol: number) => {

159-193: 行 191 逻辑尚未被测试覆盖。
增加一个模拟输入数值边界、触发 onChange 回调的单元测试用例,可提升测试覆盖率。

需要协助添加测试用例吗?可以提供示例测试脚本。

🧰 Tools
🪛 GitHub Check: codecov/patch

[warning] 191-191: src/packages/inputnumber/inputnumber.tsx#L191
Added line #L191 was not covered by tests


206-206: 建议使用可选链替代 onBlur && onBlur(e)
这是更加简洁的写法,符合现代 JavaScript 语法习惯。

- onBlur && onBlur(e)
+ onBlur?.(e)
🧰 Tools
🪛 Biome (1.9.4)

[error] 206-206: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)

src/packages/inputnumber/inputnumber.taro.tsx (1)

209-209: 建议使用可选链替代 onBlur && onBlur(e)
与主仓库中其他类似写法保持一致。

- onBlur && onBlur(e)
+ onBlur?.(e)
🧰 Tools
🪛 Biome (1.9.4)

[error] 209-209: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)

src/packages/inputnumber/demos/h5/demo8.tsx (1)

10-18: beforeChange 中使用 setTimeout 与 Toast 搭配演示异步场景。
目前提示文字“2秒后更改”与 500ms 延时略有差别,可适当统一。

- Toast.show({ icon: 'loading', content: '异步演示2秒后更改' })
- setTimeout(() => { ... }, 500)
+ Toast.show({ icon: 'loading', content: '异步演示0.5秒后更改' })
+ setTimeout(() => { ... }, 500)
src/packages/inputnumber/demos/taro/demo8.tsx (1)

32-38: 建议优化 InputNumber 组件的属性设置

考虑添加错误处理以提高代码健壮性。

 <InputNumber
   value={inputValue}
   min={-9999}
+  onError={(error) => {
+    toastShow(error.message, 'fail')
+  }}
   beforeChange={beforeChange}
   onChange={(value) => setInputValue(Number(value))}
   onOverlimit={overlimit}
 />
src/packages/inputnumber/__tests__/inputnumber.spec.tsx (1)

174-185: 建议完善溢出测试用例

当前的溢出测试可以更全面。

 test('should overlimit when input', async () => {
   const overlimit = vi.fn()
+  const beforeChange = vi.fn().mockResolvedValue(true)
   const { container } = render(
-    <InputNumber defaultValue={2} max={100} onOverlimit={overlimit} />
+    <InputNumber
+      defaultValue={2}
+      max={100}
+      onOverlimit={overlimit}
+      beforeChange={beforeChange}
+    />
   )
   const input = container.querySelectorAll('input')[0]
   input.value = '200'
   await act(async () => {
     fireEvent.input(input)
   })
   expect(overlimit).toBeCalled()
+  expect(beforeChange).toBeCalled()
 })
src/packages/inputnumber/doc.md (1)

143-153: CSS 变量更新与语言表达建议
CSS 变量的默认值已更新,并新增了 --nutui-inputnumber-button-border-radius 变量,整体符合设计更新要求。同时,文档中部分描述如“input的宽度”等使用了英文术语“input”。建议考虑将其替换为更符合中文表达的“输入框”,以提高语义一致性和用户的理解。

🧰 Tools
🪛 LanguageTool

[locale-violation] ~143-~143: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...-- | --- | --- | | --nutui-inputnumber-input-width | 数字输入框中input的宽度 | 40px | | --...

(GL_BARBARISM_REPLACE)


[locale-violation] ~144-~144: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...ut的宽度 | 40px | | --nutui-inputnumber-input-height | 数字输入框中input的高度 | 24px | | -...

(GL_BARBARISM_REPLACE)


[locale-violation] ~145-~145: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...ut的高度 | 24px | | --nutui-inputnumber-input-background-color | 数字输入框中input的背景颜色 | `...

(GL_BARBARISM_REPLACE)


[locale-violation] ~145-~145: 'background' é un xenismo. É preferíbel dicir "formación de base"
Context: ...| 24px | | --nutui-inputnumber-input-background-color | 数字输入框中input的背景颜色 | `$color-back...

(GL_BARBARISM_REPLACE)


[locale-violation] ~145-~145: 'background' é un xenismo. É preferíbel dicir "formación de base"
Context: ...t-background-color | 数字输入框中input的背景颜色 | $color-background | | --nutui-inputnumber-input-font-co...

(GL_BARBARISM_REPLACE)


[locale-violation] ~146-~146: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...or-background| | \--nutui-inputnumber-input-font-color | 数字输入框中input的字号颜色 |$color...

(GL_BARBARISM_REPLACE)


[locale-violation] ~147-~147: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...$color-title | | --nutui-inputnumber-input-font-size | 数字输入框中input的字号大小 | 14px |...

(GL_BARBARISM_REPLACE)


[locale-violation] ~148-~148: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...的字号大小 | 14px | | --nutui-inputnumber-input-border | 数字输入框中input的border值 | 0 | | ...

(GL_BARBARISM_REPLACE)


[locale-violation] ~149-~149: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...的border值 | 0 | | --nutui-inputnumber-input-border-radius | 数字输入框中input的圆角 | 6px ...

(GL_BARBARISM_REPLACE)


[locale-violation] ~150-~150: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...put的圆角 | 6px | | --nutui-inputnumber-input-margin | 数字输入框中input的margin值 | 0 | | ...

(GL_BARBARISM_REPLACE)

📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between a5014bf and adf3f0f.

📒 Files selected for processing (9)
  • src/packages/inputnumber/__tests__/inputnumber.spec.tsx (8 hunks)
  • src/packages/inputnumber/demos/h5/demo8.tsx (1 hunks)
  • src/packages/inputnumber/demos/taro/demo8.tsx (1 hunks)
  • src/packages/inputnumber/doc.en-US.md (2 hunks)
  • src/packages/inputnumber/doc.md (2 hunks)
  • src/packages/inputnumber/doc.taro.md (2 hunks)
  • src/packages/inputnumber/doc.zh-TW.md (2 hunks)
  • src/packages/inputnumber/inputnumber.taro.tsx (8 hunks)
  • src/packages/inputnumber/inputnumber.tsx (7 hunks)
🧰 Additional context used
🪛 LanguageTool
src/packages/inputnumber/doc.zh-TW.md

[locale-violation] ~135-~135: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...-- | --- | --- | | --nutui-inputnumber-input-width | 數字輸入框中input的寬度 | 40px | | --...

(GL_BARBARISM_REPLACE)


[locale-violation] ~136-~136: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...ut的寬度 | 40px | | --nutui-inputnumber-input-height | 數字輸入框中input的高度 | 24px | | -...

(GL_BARBARISM_REPLACE)


[locale-violation] ~137-~137: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...ut的高度 | 24px | | --nutui-inputnumber-input-background-color | 數字輸入框中input的背景顏色 | `...

(GL_BARBARISM_REPLACE)


[locale-violation] ~137-~137: 'background' é un xenismo. É preferíbel dicir "formación de base"
Context: ...| 24px | | --nutui-inputnumber-input-background-color | 數字輸入框中input的背景顏色 | `$color-back...

(GL_BARBARISM_REPLACE)


[locale-violation] ~137-~137: 'background' é un xenismo. É preferíbel dicir "formación de base"
Context: ...t-background-color | 數字輸入框中input的背景顏色 | $color-background | | --nutui-inputnumber-input-font-co...

(GL_BARBARISM_REPLACE)


[locale-violation] ~138-~138: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...or-background| | \--nutui-inputnumber-input-font-color | 數字輸入框中input的字號顏色 |$color...

(GL_BARBARISM_REPLACE)


[locale-violation] ~139-~139: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...$color-title | | --nutui-inputnumber-input-font-size | 數字輸入框中input的字號大小 | 14px |...

(GL_BARBARISM_REPLACE)


[locale-violation] ~140-~140: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...的字號大小 | 14px | | --nutui-inputnumber-input-border | 數字輸入框中input的border值 | 0 | | ...

(GL_BARBARISM_REPLACE)


[locale-violation] ~141-~141: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...的border值 | 0 | | --nutui-inputnumber-input-border-radius | 數字輸入框中input的圓角 | 6px ...

(GL_BARBARISM_REPLACE)


[locale-violation] ~142-~142: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...put的圓角 | 6px | | --nutui-inputnumber-input-margin | 數字輸入框中input的margin值 | 0 | | ...

(GL_BARBARISM_REPLACE)

src/packages/inputnumber/doc.md

[locale-violation] ~143-~143: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...-- | --- | --- | | --nutui-inputnumber-input-width | 数字输入框中input的宽度 | 40px | | --...

(GL_BARBARISM_REPLACE)


[locale-violation] ~144-~144: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...ut的宽度 | 40px | | --nutui-inputnumber-input-height | 数字输入框中input的高度 | 24px | | -...

(GL_BARBARISM_REPLACE)


[locale-violation] ~145-~145: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...ut的高度 | 24px | | --nutui-inputnumber-input-background-color | 数字输入框中input的背景颜色 | `...

(GL_BARBARISM_REPLACE)


[locale-violation] ~145-~145: 'background' é un xenismo. É preferíbel dicir "formación de base"
Context: ...| 24px | | --nutui-inputnumber-input-background-color | 数字输入框中input的背景颜色 | `$color-back...

(GL_BARBARISM_REPLACE)


[locale-violation] ~145-~145: 'background' é un xenismo. É preferíbel dicir "formación de base"
Context: ...t-background-color | 数字输入框中input的背景颜色 | $color-background | | --nutui-inputnumber-input-font-co...

(GL_BARBARISM_REPLACE)


[locale-violation] ~146-~146: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...or-background| | \--nutui-inputnumber-input-font-color | 数字输入框中input的字号颜色 |$color...

(GL_BARBARISM_REPLACE)


[locale-violation] ~147-~147: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...$color-title | | --nutui-inputnumber-input-font-size | 数字输入框中input的字号大小 | 14px |...

(GL_BARBARISM_REPLACE)


[locale-violation] ~148-~148: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...的字号大小 | 14px | | --nutui-inputnumber-input-border | 数字输入框中input的border值 | 0 | | ...

(GL_BARBARISM_REPLACE)


[locale-violation] ~149-~149: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...的border值 | 0 | | --nutui-inputnumber-input-border-radius | 数字输入框中input的圆角 | 6px ...

(GL_BARBARISM_REPLACE)


[locale-violation] ~150-~150: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...put的圆角 | 6px | | --nutui-inputnumber-input-margin | 数字输入框中input的margin值 | 0 | | ...

(GL_BARBARISM_REPLACE)

src/packages/inputnumber/doc.taro.md

[locale-violation] ~134-~134: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...-- | --- | --- | | --nutui-inputnumber-input-width | 数字输入框中input的宽度 | 40px | | --...

(GL_BARBARISM_REPLACE)


[locale-violation] ~135-~135: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...ut的宽度 | 40px | | --nutui-inputnumber-input-height | 数字输入框中input的高度 | 24px | | -...

(GL_BARBARISM_REPLACE)


[locale-violation] ~136-~136: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...ut的高度 | 24px | | --nutui-inputnumber-input-background-color | 数字输入框中input的背景颜色 | `...

(GL_BARBARISM_REPLACE)


[locale-violation] ~136-~136: 'background' é un xenismo. É preferíbel dicir "formación de base"
Context: ...| 24px | | --nutui-inputnumber-input-background-color | 数字输入框中input的背景颜色 | `$color-back...

(GL_BARBARISM_REPLACE)


[locale-violation] ~136-~136: 'background' é un xenismo. É preferíbel dicir "formación de base"
Context: ...t-background-color | 数字输入框中input的背景颜色 | $color-background | | --nutui-inputnumber-input-font-co...

(GL_BARBARISM_REPLACE)


[locale-violation] ~137-~137: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...or-background| | \--nutui-inputnumber-input-font-color | 数字输入框中input的字号颜色 |$color...

(GL_BARBARISM_REPLACE)


[locale-violation] ~138-~138: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...$color-title | | --nutui-inputnumber-input-font-size | 数字输入框中input的字号大小 | 14px |...

(GL_BARBARISM_REPLACE)


[locale-violation] ~139-~139: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...的字号大小 | 14px | | --nutui-inputnumber-input-border | 数字输入框中input的border值 | 0 | | ...

(GL_BARBARISM_REPLACE)


[locale-violation] ~140-~140: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...的border值 | 0 | | --nutui-inputnumber-input-border-radius | 数字输入框中input的圆角 | 6px ...

(GL_BARBARISM_REPLACE)


[locale-violation] ~141-~141: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...put的圆角 | 6px | | --nutui-inputnumber-input-margin | 数字输入框中input的margin值 | 0 | | ...

(GL_BARBARISM_REPLACE)

🪛 Biome (1.9.4)
src/packages/inputnumber/inputnumber.taro.tsx

[error] 209-209: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)

src/packages/inputnumber/inputnumber.tsx

[error] 206-206: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)

🪛 GitHub Check: codecov/patch
src/packages/inputnumber/inputnumber.tsx

[warning] 191-191: src/packages/inputnumber/inputnumber.tsx#L191
Added line #L191 was not covered by tests

⏰ Context from checks skipped due to timeout of 90000ms (1)
  • GitHub Check: test
🔇 Additional comments (24)
src/packages/inputnumber/inputnumber.tsx (5)

12-12: 引入 bound 函数值得肯定。
它能有效限制数值范围,避免越界问题。


31-31: 新增 beforeChange 属性接口设计合理。
支持同步或异步布尔判断,为后续异步逻辑扩展提供良好基础。


48-48: 默认值使用 Promise.resolve(true) 合理。
确保在未显式传入 beforeChange 时也能正常运行,无需额外判断。


77-77: 在解构中获取 beforeChange
此处逻辑清晰,暂无明显问题。


106-110: 使用 bound 校正数值边界有助于稳定性。
同时要注意解析浮点数时可能出现非数字(NaN)的特殊情况,建议在后续调用链中确认。

src/packages/inputnumber/inputnumber.taro.tsx (8)

2-3: 导入类型声明合理。
ChangeEventFunctionComponent 有助于更好地约束函数入参。


9-10: 引入 classNames 库与 Taro 组件配合正常。
注意后续若引入更多第三方组件库时,避免冲突即可。


13-13: 使用 bound 函数防止数值越界。
同样需留意 NaN 的情况,减少潜在异常。


33-37: 扩展 onChange 增加对 React.MouseEvent 的兼容。
Taro 端操作时可能混合使用不同事件,兼容性值得肯定。


50-50: 默认 beforeChange 函数可减少调用方的额外判断。
与主项目逻辑保持一致。


80-80: 在解构 props 时引入 beforeChange
便于在下方统一管理异步逻辑,风格一致。


138-161: update 函数异步化后结构更清晰。
配合 beforeChange 能灵活控制是否更新值,易读易维护。


176-197: handleInputChange 实现异步校验,可满足复杂场景需求。
beforeChange 返回 false,逻辑能即时中断,操作体验更流畅。

src/packages/inputnumber/demos/h5/demo8.tsx (2)

2-2: 导入 Toast 并展示加载动画是个好想法。
能在演示场景更直观地反馈异步操作。


22-28: 修改 min-9999 并使用 beforeChange 优化示例逻辑。
支持更大数值范围,加上异步校验,能更好展示高级用法。

src/packages/inputnumber/demos/taro/demo8.tsx (1)

19-28: 异步处理逻辑优化良好

新增的 beforeChange 方法通过 Promise 实现了更优雅的异步处理,代替了原有的 async 属性。

src/packages/inputnumber/__tests__/inputnumber.spec.tsx (1)

12-33: 测试用例异步处理改进

使用 actasync/await 正确处理了异步操作,确保测试结果的准确性。

src/packages/inputnumber/doc.zh-TW.md (2)

116-119: 文档更新清晰完整

  • 正确标注了 async 属性的废弃
  • 新增了 beforeChangeselect 属性的说明

135-145: CSS 变量更新合理

样式变量的默认值调整提升了组件的视觉表现。

🧰 Tools
🪛 LanguageTool

[locale-violation] ~135-~135: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...-- | --- | --- | | --nutui-inputnumber-input-width | 數字輸入框中input的寬度 | 40px | | --...

(GL_BARBARISM_REPLACE)


[locale-violation] ~136-~136: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...ut的寬度 | 40px | | --nutui-inputnumber-input-height | 數字輸入框中input的高度 | 24px | | -...

(GL_BARBARISM_REPLACE)


[locale-violation] ~137-~137: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...ut的高度 | 24px | | --nutui-inputnumber-input-background-color | 數字輸入框中input的背景顏色 | `...

(GL_BARBARISM_REPLACE)


[locale-violation] ~137-~137: 'background' é un xenismo. É preferíbel dicir "formación de base"
Context: ...| 24px | | --nutui-inputnumber-input-background-color | 數字輸入框中input的背景顏色 | `$color-back...

(GL_BARBARISM_REPLACE)


[locale-violation] ~137-~137: 'background' é un xenismo. É preferíbel dicir "formación de base"
Context: ...t-background-color | 數字輸入框中input的背景顏色 | $color-background | | --nutui-inputnumber-input-font-co...

(GL_BARBARISM_REPLACE)


[locale-violation] ~138-~138: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...or-background| | \--nutui-inputnumber-input-font-color | 數字輸入框中input的字號顏色 |$color...

(GL_BARBARISM_REPLACE)


[locale-violation] ~139-~139: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...$color-title | | --nutui-inputnumber-input-font-size | 數字輸入框中input的字號大小 | 14px |...

(GL_BARBARISM_REPLACE)


[locale-violation] ~140-~140: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...的字號大小 | 14px | | --nutui-inputnumber-input-border | 數字輸入框中input的border值 | 0 | | ...

(GL_BARBARISM_REPLACE)


[locale-violation] ~141-~141: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...的border值 | 0 | | --nutui-inputnumber-input-border-radius | 數字輸入框中input的圓角 | 6px ...

(GL_BARBARISM_REPLACE)


[locale-violation] ~142-~142: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...put的圓角 | 6px | | --nutui-inputnumber-input-margin | 數字輸入框中input的margin值 | 0 | | ...

(GL_BARBARISM_REPLACE)

src/packages/inputnumber/doc.taro.md (2)

118-122: 事件类型更新准确

更新后的事件类型更好地支持了移动端触摸事件。


134-144: 样式变量更新合理

新的尺寸和圆角设置提升了移动端的用户体验。

🧰 Tools
🪛 LanguageTool

[locale-violation] ~134-~134: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...-- | --- | --- | | --nutui-inputnumber-input-width | 数字输入框中input的宽度 | 40px | | --...

(GL_BARBARISM_REPLACE)


[locale-violation] ~135-~135: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...ut的宽度 | 40px | | --nutui-inputnumber-input-height | 数字输入框中input的高度 | 24px | | -...

(GL_BARBARISM_REPLACE)


[locale-violation] ~136-~136: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...ut的高度 | 24px | | --nutui-inputnumber-input-background-color | 数字输入框中input的背景颜色 | `...

(GL_BARBARISM_REPLACE)


[locale-violation] ~136-~136: 'background' é un xenismo. É preferíbel dicir "formación de base"
Context: ...| 24px | | --nutui-inputnumber-input-background-color | 数字输入框中input的背景颜色 | `$color-back...

(GL_BARBARISM_REPLACE)


[locale-violation] ~136-~136: 'background' é un xenismo. É preferíbel dicir "formación de base"
Context: ...t-background-color | 数字输入框中input的背景颜色 | $color-background | | --nutui-inputnumber-input-font-co...

(GL_BARBARISM_REPLACE)


[locale-violation] ~137-~137: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...or-background| | \--nutui-inputnumber-input-font-color | 数字输入框中input的字号颜色 |$color...

(GL_BARBARISM_REPLACE)


[locale-violation] ~138-~138: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...$color-title | | --nutui-inputnumber-input-font-size | 数字输入框中input的字号大小 | 14px |...

(GL_BARBARISM_REPLACE)


[locale-violation] ~139-~139: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...的字号大小 | 14px | | --nutui-inputnumber-input-border | 数字输入框中input的border值 | 0 | | ...

(GL_BARBARISM_REPLACE)


[locale-violation] ~140-~140: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...的border值 | 0 | | --nutui-inputnumber-input-border-radius | 数字输入框中input的圆角 | 6px ...

(GL_BARBARISM_REPLACE)


[locale-violation] ~141-~141: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...put的圆角 | 6px | | --nutui-inputnumber-input-margin | 数字输入框中input的margin值 | 0 | | ...

(GL_BARBARISM_REPLACE)

src/packages/inputnumber/doc.md (1)

124-127: 属性描述更新正确
本次更新将废弃的 async 属性标记并添加了 beforeChange 属性,同时附带了版本提示。文档中针对异步修改的描述清晰,符合新版实现逻辑,建议开发者确认文档描述与组件代码的一致性。

src/packages/inputnumber/doc.en-US.md (2)

124-127: Property Description Update Verified
The deprecation of the async property and the introduction of the beforeChange property—with appropriate version notes—are clearly documented. Ensure that the description remains consistent with the underlying component implementation.


143-153: CSS Variable Updates Confirmed
The changes in CSS variable default values and the addition of the new variable --nutui-inputnumber-button-border-radius align with the component’s updated design. Please verify that these values match the design specifications.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
3.x Target branch 3.x action:review This PR needs more reviews (less than 2 approvals) size/XL
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant