'How to remove default value from input number in vue?

I have a Vue input number component which accepts precision upto five decimal points. Its all fine except it shows the default value 0.000000 which is kinda boring to look at because this field is optional. I am using el-input-number component from the element-ui. Is there any tweak to remove the boring default value of 0.000000 ?

<span class="custom-label">
Optional Multiplier Amount
</span>
<el-input-number
   :controls="false"
   v-model="form.multiplier_amount"
   :size="size"
   :step="0.1"
   :precision="5"
   class="optional-multiplier"
   />

data(){
 return{
  form: {
    multiplier_amount: null
        }
       }
      }

enter image description here

javascripthtmlvue.jsnuxt.jselement-ui


Solution 1:[1]

Just set it as undefined:

new Vue({
  el: "#demo",
  data(){
    return{
      form: {
        multiplier_amount: undefined
      },
    }
  }
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<div id="demo">
  <span class="custom-label">
    Optional Multiplier Amount
  </span>
  <el-input-number
    :controls="false"
    v-model="form.multiplier_amount"
    :step="0.1"
    class="optional-multiplier"
    :precision="5"
  />
</div>

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1

Related Questions