VueJS不顯示輸入值，如果其0

Question

我有被預先從我的數據庫填充的輸入欄，但我不會希望它被預先填充值是否

如：

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

如果

data: { 
price: 0 
} 

我不希望我的輸入欄顯示爲0，我知道我可以做的東西一樣:disabled="price == 0"但是這將隱藏整個inputfield，我只是不想顯示的價值，如果它0

Answer 1

簡單地改變價格空字符串時，它的0：

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

Answer 2

據我所知，當價格的價格是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