vue 2.0 filter html,Vue2.0 v-for filter列表过滤功能的实现

使用计算属性app.js

var app5 = new Vue({

el: '#app5',

data: {

shoppingList: [

"Milk", "Donuts", "Cookies", "Chocolate", "Peanut Butter", "Pepto Bismol", "Pepto Bismol (Chocolate flavor)", "Pepto Bismol (Cookie flavor)"

],

key: ""

},

computed: {

filterShoppingList: function () {

// `this` points to the vm instance

var key = this.key;

var shoppingList = this.shoppingList;

return shoppingList.filter(function (item) {

return item.toLowerCase().indexOf(key.toLowerCase()) != -1

});;

}

}

})

app.html

Vue-for

• {{ item }}

Vue-for filter实现

Filter Key

{{ item }}

最终效果实现了根据关键字来过滤列表的功能。

以上这篇Vue2.0 v-for filter列表过滤功能的实现就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。