Как для input во Vue реализовать регулярное выражение которое может принимать не только целые числа но и типа float?
Текущее решение работает для целых чисел, но не для типа float.
<template>
<div class="input-list flex align-items-center mb-2">
<label class="label w-6">{{ name }}</label>
<div class="flex justify-content-end w-6">
<input
:name="paramName"
v-model="list"
@keydown="formatNumbers"
@mouseout="formatNumbers"
@input="onChangeList(newList)"
/>
</div>
</div>
</template>
<script setup>
import {computed, reactive, ref} from "vue";
const props = defineProps({
name: String,
paramName: String,
model: [String, Array, Number],
disabledStatus: Boolean,
})
const emit = defineEmits(['change-list'])
const val = props.model.toString()
const newList = ref([])
const o = reactive({})
const list = computed({
get() {
return val.replace(/[^0-9]/g, ' ')
},
set(newVal) {
newList.value = newVal.replace(/[^0-9]+/g, ' ')
}
})
function formatNumbers(e) {
e.target.value = e.target.value.replace(/[^0-9]+/g, ' ')
}
const onChangeList = (val) => {
Object.defineProperty(o, props.paramName, {
value: val,
writable: true,
enumerable: true,
configurable: true
})
emit('change-list', o)
}
<script>
Ответы (1 шт):
Автор решения: Kain
→ Ссылка
Вот эта строка убирает из введенного значения все символы кроме цифр (зачем меняет на пробелы - непонятно)
value.replace(/[^0-9]+/g, ' ')
Замените на
value.replace(/[^0-9\.]+/g, '')
и тогда он не будет убирать еще и точки. Преобразуете строку в число, проверяете, что оно верное:
+'1.43.3' = NaN
+'1.433' = 1.433