iview: inputNumber 控制最小值输入及step手

2021-08-24  本文已影响0人  岚平果

一、控制最小值输入

<InputNumber min="9" v-model="num"><InputNumber/>

输入任意数字都会变成9,我想输入12但是刚输入1输入框中的值就成了9,感觉是个InputNumber组件的bug??

<InputNumber min="9" v-model="num" :active-change="false" ><InputNumber/>

修改后InputNumber就会在失去焦点时候才出发change事件,这个最小值输入的体验问题就解决了。

二、进行手动输入要根据step

<InputNumber :active-change="false" :max="attr.cellMax" :step="Number(attr.unitValue)" 
  :min="attr.cellMin" :value="formValidate[attr.cellCode]" 
  @on-change="changeNumber($event, attr.cellCode, Number(attr.unitValue))">
</InputNumber>

methods: {
      // 手动输入,要按照step的规则来修改数值
    changeNumber (val, key, step) {
            this.formValidate[key] = val;
            this.$nextTick(() => {
                let tenInt = Math.round(val / step) * step;
                this.formValidate[key] = tenInt;
            })
        },
}
上一篇 下一篇

猜你喜欢

热点阅读