vue 项目根据多条件筛选数组

本文已参与「新人创作礼」活动，一起开启掘金创作之路。

1.需求：多条件筛选数组----废话不哆嗦，直接上图

 data(){
    return{
      form:{
        name:'',
        age:'',
        adder:'日本'
      },
      arr:[{
        name:'名字1',
        age:'1',
        adder:'北京'
      },{
        name:'名字2',
        age:'2',
        adder:'上海'
      },{
        name:'名字3',
        age:'3',
        adder:'东莞'
      },{
        name:'名字4',
        age:'4',
        adder:'日本'
      },{
        name:'名字5',
        age:'5',
        adder:'日本'
      }]
    }
  },

this.form里面就是条件，里面字段随便加

 mounted() {
 	//this.form  *** 筛选条件
  	//this.arr*** 筛选数组
    this.$filterData(this.form,this.arr) //得到新的数组
  },

//main.js里面，自己喜欢放哪里就放哪里
Vue.prototype.$filterData=function (form,list){
    let arr = list
    Object.keys(form).forEach(e => {
        if (form[e] == undefined || form[e] == '') return arr
        arr = arr.filter(p => p[e].indexOf(form[e]) > -1)   //匹配成功返回
    })
    return arr
}

返回图：