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