console
var vm = new Vue({
el: '#app',
data: {
searchtext: '',
products: [{
name: '苹果',
price: 25,
category: "水果"
},
{
name: '香蕉',
price: 15,
category: "水果"
},
{
name: '雪梨',
price: 65,
category: "水果"
},
{
name: '宝马',
price: 2500,
category: "汽车"
},
{
name: '奔驰',
price: 10025,
category: "汽车"
},
{
name: '柑橘',
price: 15,
category: "水果"
},
{
name: '奥迪',
price: 25,
category: "汽车"
}]
},
computed: {
searchData: function() {
var searchtext = this.searchtext;
if (searchtext) {
return this.products.filter(function(product) {
return Object.keys(product).some(function(key) {
return String(product[key]).toLowerCase().indexOf(searchtext) > -1
})
})
}
return this.products;
}
}
})
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<div id="app">
<input v-model='searchtext' />
<ul v-for="item in searchData ">
<li>
{{item.name}},价格:¥{{item.price}}
</li>
</ul>
</div>