vuetify 3十进制数输入

tv6aics1  于 2023-08-07  发布在  Vue.js
关注(0)|答案(1)|浏览(118)

我如何在vuetify 3中有一个十进制输入,允许.作为输入,这样我就可以写例如“123.45”?
我的当前代码:
MyNumberInput.vue

<template>
  <v-text-field v-model="value" type="number" :label="label" outlined />
</template>

<script setup lang="ts">
import { computed } from "vue";

const props = defineProps<{
  label: string;
  modelValue: number;
}>();

const emit = defineEmits(["update:modelValue"]);

const value = computed({
  get: (): number => props.modelValue,
  set: (value: number) => {
    // value is type string actually and when `.` is entered I get NaN
    emit("update:modelValue", value); // won't work as it returns the value which is of type string or NaN
  },
});
</script>

字符串

nbewdwxp

nbewdwxp1#

我想现在这样可以了

const value = computed({
  get: (): any => props.modelValue,
  set: (value: any) => {
    if (value !== "") {
      const float = parseFloat(value);
      if (!isNaN(float)) {
        emit("update:modelValue", float);
      }
    }
  },
});

字符串

相关问题