diff --git a/examples/sites/demos/apis/numeric.js b/examples/sites/demos/apis/numeric.js
index 74530b6a5b..4146bd4a36 100644
--- a/examples/sites/demos/apis/numeric.js
+++ b/examples/sites/demos/apis/numeric.js
@@ -309,13 +309,29 @@ export default {
'en-US': 'Whether to enter only multiples of step'
},
mode: ['pc', 'mobile', 'mobile-first'],
- pcDemo: 'step',
+ pcDemo: 'about-step',
mobileDemo: 'step',
mfDemo: ''
},
+ {
+ name: 'step-restore',
+ type: 'boolean',
+ defaultValue: 'false',
+ desc: {
+ 'zh-CN': '当输入值,非step步长的倍数时,是否还原上一个值',
+ 'en-US': 'When the input value is not a multiple of the step size, should the previous value be restored'
+ },
+ meta: {
+ stable: '3.20.0'
+ },
+ mode: ['pc'],
+ pcDemo: 'about-step',
+ mobileDemo: '',
+ mfDemo: ''
+ },
{
name: 'strict-input',
- type: 'Boolean',
+ type: 'boolean',
defaultValue: '',
desc: {
'zh-CN': '严格控制输入,包含合法性输入与小数点长度验证,不允许输入超过精度设置',
diff --git a/examples/sites/demos/pc/app/numeric/about-step-composition-api.vue b/examples/sites/demos/pc/app/numeric/about-step-composition-api.vue
index eae958efd8..a3f0c81880 100644
--- a/examples/sites/demos/pc/app/numeric/about-step-composition-api.vue
+++ b/examples/sites/demos/pc/app/numeric/about-step-composition-api.vue
@@ -1,5 +1,14 @@
-
+
+
+
diff --git a/examples/sites/demos/pc/app/numeric/about-step.spec.ts b/examples/sites/demos/pc/app/numeric/about-step.spec.ts
index d5ee82661d..85f6d56bb8 100644
--- a/examples/sites/demos/pc/app/numeric/about-step.spec.ts
+++ b/examples/sites/demos/pc/app/numeric/about-step.spec.ts
@@ -4,15 +4,23 @@ test('步长', async ({ page }) => {
page.on('pageerror', (exception) => expect(exception).toBeNull())
await page.goto('numeric#about-step')
- const input = page.getByRole('spinbutton')
- const increaseBtn = page.locator('.tiny-numeric__increase')
- const decreaseBtn = page.locator('.tiny-numeric__decrease')
- const value = Number(await input.inputValue())
- const step = 2
- await decreaseBtn.click()
- const decreasedVal = Number(await input.inputValue())
- expect(value).toEqual(decreasedVal + step)
- await increaseBtn.click()
- const increasedVal = Number(await input.inputValue())
- expect(decreasedVal).toEqual(increasedVal - step)
+ await page.getByRole('button').nth(1).click()
+ await page.getByRole('spinbutton').first().fill('56')
+ await page
+ .locator('div')
+ .filter({ hasText: /step-restore/ })
+ .first()
+ .click()
+ const inputValue = await page.locator('.tiny-numeric__input-inner').first().inputValue()
+ expect(inputValue).toEqual('5')
+
+ await page.getByRole('button').nth(3).click()
+ await page.getByRole('spinbutton').nth(1).fill('56')
+ await page
+ .locator('div')
+ .filter({ hasText: /step-strictly/ })
+ .first()
+ .click()
+ const input = await page.locator('.tiny-numeric__input-inner').nth(1).inputValue()
+ expect(input).toEqual('55')
})
diff --git a/examples/sites/demos/pc/app/numeric/about-step.vue b/examples/sites/demos/pc/app/numeric/about-step.vue
index d3ac9ba9d6..ac50461276 100644
--- a/examples/sites/demos/pc/app/numeric/about-step.vue
+++ b/examples/sites/demos/pc/app/numeric/about-step.vue
@@ -1,5 +1,14 @@
-
+
+
+
diff --git a/examples/sites/demos/pc/app/numeric/webdoc/numeric.js b/examples/sites/demos/pc/app/numeric/webdoc/numeric.js
index 3ea5663c0d..bf74f26ec4 100644
--- a/examples/sites/demos/pc/app/numeric/webdoc/numeric.js
+++ b/examples/sites/demos/pc/app/numeric/webdoc/numeric.js
@@ -35,8 +35,10 @@ export default {
'en-US': 'Step'
},
desc: {
- 'zh-CN': '可通过step
属性设置计数器的加减数值。',
- 'en-US': 'Set the addition and subtraction values of the counter through thestep
attribute.'
+ 'zh-CN':
+ '可通过step
属性设置计数器的加减数值,step-restore
属性设置是否还原上一个值,step-strictly
属性设置只能输入 step 的倍数',
+ 'en-US':
+ 'Set the addition and subtraction values of the counter through thestep
attribute,step-restore
property setting whether to restore the previous value,step restricted
The attribute setting can only input multiples of step'
},
codeFiles: ['about-step.vue']
},
diff --git a/packages/renderless/src/numeric/index.ts b/packages/renderless/src/numeric/index.ts
index 17e31c9087..83ac5f3c03 100644
--- a/packages/renderless/src/numeric/index.ts
+++ b/packages/renderless/src/numeric/index.ts
@@ -302,6 +302,11 @@ export const setCurrentValue =
if (validateEvent) {
dispatch(constants.COMPONENT_NAME, constants.EVENT_NAME.change, [state.currentValue])
}
+
+ if (props.stepRestore && props.step > 1 && newVal % Number(props.step) !== 0) {
+ state.currentValue = oldVal
+ state.userInput = oldVal
+ }
}
}
diff --git a/packages/vue/src/numeric/src/index.ts b/packages/vue/src/numeric/src/index.ts
index 1b07b3a849..c5fbc2c3c9 100644
--- a/packages/vue/src/numeric/src/index.ts
+++ b/packages/vue/src/numeric/src/index.ts
@@ -97,6 +97,10 @@ export const numericProps = {
type: [Number, String],
default: 1
},
+ stepRestore: {
+ type: Boolean,
+ default: false
+ },
stepStrictly: {
type: Boolean,
default: false
diff --git a/packages/vue/src/numeric/src/pc.vue b/packages/vue/src/numeric/src/pc.vue
index de7962b375..5c6c21cac5 100644
--- a/packages/vue/src/numeric/src/pc.vue
+++ b/packages/vue/src/numeric/src/pc.vue
@@ -223,6 +223,7 @@ export default defineComponent({
...props,
'step',
'tabindex',
+ 'stepRestore',
'stepStrictly',
'max',
'min',