过滤应用
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
<title>过滤应用</title>
</head>
<body>
<div id="box">
<p><input type="text" id="" v-model="mytext" />value改变就会触发</p>
<!-- <p><input type="text" id="" value="" @change="handipt2()" />失去焦点就会触发</p> -->
<ul>
<!-- getmydatalist计算属性不仅仅可以写在{{}}中 还可以直接写在这个属性中 -->
<li v-for="msg in getmydatalist">
{{msg}}
</li>
</ul>
</div>
<script type="text/javascript">
//['aaaa','bbbb','ccccc','dddd','eeee']
var vue = new Vue({
el: '#box',
data: {
mytext: '',
dataList: ['aaa', 'bbb', 'ccc', 'ddd', 'add', 'cee', 'eee'],
},
methods: {
},
computed: {
getmydatalist() {
return this.dataList.filter(res=>res.indexOf(this.mytext)>-1)
}
}
})
</script>
</body>
</html>
