vuetify.js

Why vuetify v-number-input doesn't display decimals when not focused?

I have a v-number-input whose step value is 0.001 When focused, using the spinner button increases or decreases the value by 0.001, e.g., with + from 1.036 to 1.037. That is fine, but when clicking outside the field, the value displayed becomes 1. Clicking into the field again (focus) makes the field display 1.037 again, and so on repeatedly. Thanks in advance for an explanation.

The code:

<v-number-input v-model="model" :step="0.001" :min="1.020" />
Solution

  • precision prop was introduced in vuetify v3.7.13 https://github.com/vuetifyjs/vuetify/pull/20252

    It is 0 by default which means only integer is allowed. You can set precision as null to disable strict precision or give it a positive number to specify how many decimal places there are:

    <v-number-input :precision="3" />