magiccube-vue3
Version:
vue3-js版组件库
52 lines (51 loc) • 1.76 kB
JavaScript
/**
* @param {string} value float/int
*/
const getLastInputValue = (val) => {
const str = val.toString()
return str.substring(str.length - 1, str.length)
}
const isLastInputPoint = (val) => {
return getLastInputValue(val) === '.'
}
const isSinglePoint = (val) => {
let count = 0
const arr = val.toString().split('')
arr.forEach(n => {
if(n === '.') count++
})
return count === 1
}
const getFloatByDecimalCOunt = (val, decimal) => {
const str = val.toString()
const arr = str.split('.')
return parseFloat(`${arr[0] || 0}.${arr[1]?.substring(0, decimal) || 0}`)
}
export default {
name: 'NumberInput',
directive: {
mounted(el, { value }) {
const { onlyInt, decimal } = value
el.oninput = () => {
const inputVal = el.value.toString()
if(!inputVal || inputVal === '0') return
if(onlyInt){
el.value = /^[0-9]+$/.test(inputVal)? inputVal : inputVal.substring(0, inputVal.length - 1)
} else {
if(isLastInputPoint(inputVal)) {
if(isSinglePoint(inputVal)){
return false
} else {
el.value = inputVal.substring(0, inputVal.length - 1)
}
} else if(/[0-9]/.test(getLastInputValue(inputVal))){
if(getLastInputValue(inputVal) === '0') return
el.value = getFloatByDecimalCOunt(inputVal, decimal) || ''
} else {
el.value = inputVal.substring(0, inputVal.length - 1)
}
}
}
},
},
}