对数据进行筛选功能。
**功能分析:**当你输入一串文字时,以最快的速度筛选出相对应的内容,如果没有对应的内容则不予显示。
效果演示
原始样式
在输入框输入平板时筛选相应的内容
代码演示
**注意:**引入Vue.js架包
<!DOCTYPE html><html><head><meta charset="UTF-8"><title></title><script src="js/vue.js" type="text/javascript" charset="utf-8"></script></head><body><div id="out"><h1>输入数据进行筛选</h1><input type="text" v-model="texts"/><ul v-for="item in list"><li>{{item}}</li></ul></div></body><script type="text/javascript">var vm = new Vue({el:"#out",data:{texts:"",arr:["手机","电脑","电视","平板","电话","耳机","鼠标","键盘","显示器"]},computed:{list(){let arr1 = []this.arr.map(function(item){if(item.indexOf(this.texts)!=-1){arr1.push(item)} }.bind(this))return arr1}}})</script></html>
扫一扫关注我的公众号获取更多资讯呦!!!