前端实现点击查询按钮实现列表过滤

1.查询过滤函数

    searchBtn() {
      var search = this.queryInfo.wasteFactoryName;
      if (search) {
        this.searchData = this.tableInfo.filter(function (tableInfo) {
          console.log(tableInfo);
          return Object.keys(tableInfo).some(function (key) {
            console.log(key);
            return String(tableInfo[key]).toLowerCase().indexOf(search) > -1;
          });
        });
        this.tableInfo = this.searchData;
        this.loading = false;
      }
    },

2.注释

search: "",
searchData: "",//过滤之后的数据
tableInfo: [], //接口数据res.data.list
queryInfo: {
        wasteFactoryName: "",
        wasteName: "",
      },

注1:tableInfo为所有需要过滤的数组数据(从后端拿到并保存到tableInfo的数据)

注2:this.queryInfo.wasteFactoryName为需要查询的关键字段

注3:searchData为过滤之后的数据

发表评论 / Comment

用心评论~