时间：2021-01-30 10:26:45 | 栏目：vue | 点击：次
本文实例为大家分享了Vue通过input筛选数据的具体代码，供大家参考，具体内容如下
<div id="app">
<input v-model='search' />
<ul>
<li v-for="item in items">
<label>价格</label><span v-html="item.name"></span>
<label>￥</label><span v-html="item.price"></span>
</ul>
</div>
new Vue({
el: '#app',
data: {
search: '',
products: [{
name: '苹果',
price: 25
}, {
name: '香蕉',
price: 15
}, {
name: '雪梨',
price: 65
}, {
name: '宝马',
price: 2500
}, {
name: '奔驰',
price: 10025
}, {
name: '柑橘',
price: 15
}, {
name: '奥迪',
price: 25
}]
},
computed: {
items: function() {
var _search = this.search;
if (_search) {
return this.products.filter(function(product) {
return Object.keys(product).some(function(key) {
return String(product[key]).toLowerCase().indexOf(_search) > -1
})
})
}
return this.products;
}
}
})