欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Vue通過(guò)input篩選數(shù)據(jù)

 更新時(shí)間：2020年10月26日 13:26:13   作者：薛偉杰  
這篇文章主要為大家詳細(xì)介紹了Vue通過(guò)input篩選數(shù)據(jù)的相關(guān)代碼，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

本文實(shí)例為大家分享了Vue通過(guò)input篩選數(shù)據(jù)的具體代碼，供大家參考，具體內(nèi)容如下

<div id="app">
 <input v-model='search' />
 <ul>
 <li v-for="item in items">
  <label>價(jià)格</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: '蘋(píng)果',
  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;
 }
 }
})

關(guān)于vue.js組件的教程，請(qǐng)大家點(diǎn)擊專(zhuān)題vue.js組件學(xué)習(xí)教程進(jìn)行學(xué)習(xí)。

更多vue學(xué)習(xí)教程請(qǐng)閱讀專(zhuān)題《vue實(shí)戰(zhàn)教程》

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

相關(guān)文章

最新評(píng)論