<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="./vue.js"></script>
</head>
<body>
<div id="app">
<input type="text" v-model="selName">
<table>
<tr>
<th>姓名</th>
<th>年龄</th>
</tr>
<tr v-for="(a,idx) in selArr":key="idx">
<td>{{a.name}}</td>
<td>{{a.age}}</td>
</tr>
</table>
</div>
<script>
new Vue({
el:"#app",
data:{
arr:[
{name:"张三",age:20},
{name:"张三风",age:21},
{name:"王重阳",age:22},
],
selName:""
},
computed:{
selArr(){
var that=this;
return this.arr.filter(function(v){
return v.name.indexOf(that.selName)!=-1;
})
}
}
})
</script>
</body>
</html>
标签:el,arr,return,name,age,模糊,查询,selName,属性
From: https://blog.csdn.net/2401_83905000/article/details/142780136