VueJ가 0이면 입력 값이 표시되지 않음

VueJ가 0이면 입력 값이 표시되지 않음

DB에서 미리 입력되는 입력 필드가 있지만 값이 0인 경우 입력 필드가 미리 입력되지 않도록 합니다.

예:

<input v-model="price" type="text">

한다면

  data: {
 price: 0
}

입력 필드에 0을 표시하지 않고 다음과 같은 작업을 수행할 수 있습니다.:disabled="price == 0"하지만 이렇게 하면 입력 필드 전체가 숨겨집니다. 값이 0인 경우 값을 표시하지 않을 뿐입니다.

0일 때 가격을 빈 문자열로 변경하기만 하면 됩니다.

created() {
    //since 0 is considered false it will put an empty string in case priceFromDB is 0
    this.price = priceFromDB || ''
  }

내가 이해한 바로는, 당신은 가격 가치가 있을 때 항상 빈 입력을 원하는 것으로 알고 있다.0사용자가 수동으로 입력한 경우에도 마찬가지입니다.이것이 사실이라면 다음과 같은 것이 도움이 될 것입니다.

<div id="app">
    <input type="text" v-model="price" @keyup="trackChange">
</div>

JS:

const app = new Vue({

  el: '#app',

  data: {
    price: 0
  },

  methods: {
    trackChange() {
      this.price = parseInt(this.price) === 0  ? null : this.price
    }
  },

  created() {
    this.trackChange()
  }


})

데모: http://jsbin.com/sihuyotuto/edit?html,js,output

언급URL : https://stackoverflow.com/questions/45937359/vuejs-dont-display-input-value-if-its-0