前端搜索功能

<div style="width:500px; margin-bottom: 20px;">
<el-input size="small" v-model="inputVal" @input="searchList" clearable
placeholder="输入基金名称或代码"></el-input>
</div>

data(){
  inputVal:'',
  allData:[
{code:'001',name:'北京'},
{code:'0002',name:'上海'},
{code:'0003',name:'广州'},
{code:'0004',name:'天津'},
{code:'0005',name:'重庆'},
{code:'0006',name:'南京'},
{code:'0007',name:'太原'},
{code:'0008',name:'西安'},
{code:'0009',name:'哈尔滨'},
{code:'0010',name:'大连'},
{code:'0011',name:'青岛'},
{code:'0012',name:'杭州'},
{code:'0013',name:'福建'},
  ],
  reaultList:[],
},
methods:{
  
searchList(val){
this.reslutList=[]
if(val){
this.allData.forEach(item=>{
if(this.reslutList.length<5 && (item.code.indexOf(val)!==-1 || item.name.indexOf(val)!==-1) ){
this.reslutList.push(item)
}
})
console.log(this.reslutList);
}
},

}
posted @ 2021-03-02 15:45  白_小白  阅读(398)  评论(0)    收藏  举报