列表过滤应用
利用输入框输入的值，过滤出列表中的元素
- v-model拿到input中的值
- **filter( function(){} )**过滤函数
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<script src="./vue.js"></script>
<body>
<div class="box">
<div>
<input type="text" v-model='mymodel' @input='handelfunc()'>
<li v-for="data in datalist">{{data}}</li>
</div>
</div>
</body>
<script>
let vue = new Vue({
el:'.box',
data:{
mymodel:'',
datalist:['aaa','bbb','ccc']
},
methods:{
handelfunc(){
// console.log(this.mymodel)
let re_datalist = this.datalist.filter(item=>item.indexOf(this.mymodel)>-1)
//filter过滤元素内容，里面传回调函数，通过返回的ture和false来决定是否过滤
//indexOf通过传入值来查找item里是否有匹配字符,有返回位置，不然返回-1
console.log(re_datalist)
this.datalist = re_datalist;
//直接替换
}
}
})
</script>
</html>
vue_45">vue的事件修饰符
用事件修饰符来模拟ev.stopPropagation()阻止冒泡行为默认行为
如：
点击链接不会跳转
默认行为.stop 阻止冒泡 .prevent阻止跳转 .self审查源是否是自己
按键修饰符
![[golang 微服务] 9.go-micro + gorm实现商品微服务的分页查询](https://img-blog.csdnimg.cn/img_convert/6768f13e831af19415cffe60b96924c7.png)
