benyuanzhang
/
tiny-vue
forked from opentiny/tiny-vue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(numeric): [numeric] Fix Bug caused by initial value greater than maximum (#1284) 

* fix(numeric): Fix Bug caused by initial value greater than maximum

* fix(numeric): Fix Bug caused by initial value greater than maximum

* fix(numeric): Fix Bug caused by initial value greater than maximum
This commit is contained in:
Kif 2024-02-02 10:50:47 +08:00 committed by GitHub
parent f6257a7374
commit 34e5916278
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 15 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
examples/sites/demos/pc/app/numeric/max-min.vue
View File

@ -11,10 +11,10 @@ export default {
}, },
data() { data() {
return { return {
value: 1, value: 0,
step: 2, step: 2,
min: 0, min: 0,
max: 5 max: 10
} }
} }
} }

14
packages/renderless/src/numeric/index.ts
View File

@ -51,7 +51,6 @@ export const watchValue =
if (value === state.currentValue) { if (value === state.currentValue) {
return return
} }
api.setCurrentValue(value) api.setCurrentValue(value)
nextTick(() => { nextTick(() => {
api.dispatchDisplayedValue() api.dispatchDisplayedValue()
@ -355,8 +354,17 @@ export const select = (refs: INumericRenderlessParams['refs']) => () => refs.inp
export const mounted = export const mounted =
({ constants, parent, props, state }: Pick<INumericRenderlessParams, 'constants' | 'parent' | 'props' | 'state'>) => ({ constants, parent, props, state }: Pick<INumericRenderlessParams, 'constants' | 'parent' | 'props' | 'state'>) =>
(): void => { (): void => {
const innerInput = parent.$el.querySelector('input') if (state.currentValue < (props.min as number)) {
state.currentValue = props.min as number
state.lastInput = props.min as number
state.userInput = props.min as number
}
if (state.currentValue > (props.max as number)) {
state.currentValue = props.max as number
state.lastInput = props.max as number
state.userInput = props.max as number
}
const innerInput = parent.$el.querySelector('input')!
innerInput.setAttribute(constants.KEY, constants.VALUE) innerInput.setAttribute(constants.KEY, constants.VALUE)
innerInput.setAttribute(constants.MAX, props.max) innerInput.setAttribute(constants.MAX, props.max)
innerInput.setAttribute(constants.MIN, props.min) innerInput.setAttribute(constants.MIN, props.min)

2
packages/vue/src/numeric/__tests__/numeric.test.tsx
View File

@ -67,6 +67,7 @@ describe('PC Mode', () => {
test('min 规定组件可输入的最小数值', async () => { test('min 规定组件可输入的最小数值', async () => {
const inputValue = ref(1) const inputValue = ref(1)
const wrapper = mount(() => <Numeric v-model={inputValue.value} min={3}></Numeric>) const wrapper = mount(() => <Numeric v-model={inputValue.value} min={3}></Numeric>)
await nextTick()
expect(wrapper.find('input').element.value).toEqual('3') expect(wrapper.find('input').element.value).toEqual('3')
wrapper.find('.tiny-numeric__decrease').trigger('mousedown') wrapper.find('.tiny-numeric__decrease').trigger('mousedown')
document.dispatchEvent(mouseup) document.dispatchEvent(mouseup)
@ -77,6 +78,7 @@ describe('PC Mode', () => {
test('max 规定组件可输入的最大数值', async () => { test('max 规定组件可输入的最大数值', async () => {
const inputValue = ref(6) const inputValue = ref(6)
const wrapper = mount(() => <Numeric v-model={inputValue.value} max={3}></Numeric>) const wrapper = mount(() => <Numeric v-model={inputValue.value} max={3}></Numeric>)
await nextTick()
expect(wrapper.find('input').element.value).toEqual('3') expect(wrapper.find('input').element.value).toEqual('3')
wrapper.find('.tiny-numeric__increase').trigger('mousedown') wrapper.find('.tiny-numeric__increase').trigger('mousedown')
document.dispatchEvent(mouseup) document.dispatchEvent(mouseup)