Как для 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

→ Ссылка