Vue前端实现搜索功能

    技术2022-07-11  116

    https://blog.csdn.net/weixin_41655541/article/details/96133804 

    //新弹窗搜索 data(){ return { tableData:[ { ID: "1", ClientNO: "000111", CloudServiceName: "王小虎", Cloudnumber: "2001", }, ]; olddatas:[], input: "", //搜索 } } 某个地方得到表格数据: this.olddatas = this.tableData; //先赋值给旧数据 //点击搜索按钮 search_btn() { let search = this.input; let olddatas = this.olddatas;//旧数据 if (search == "") { this.tableData = olddatas } else { this.tableData = this.tableData.filter(function(item) { console.log("过滤", item); let searchField = { //我这里把item里面所有字段写进去了 Cloudnumber: item.Cloudnumber, ClientName: item.ClientName, CloudServiceName: item.CloudServiceName, ID: item.ID, }; return Object.keys(searchField).some(function(key) { console.log("key值", key); return ( String(item[key]) .toLowerCase() .indexOf(search) > -1 ); }); }); } },

    如果对数据中所有字段都进行排序将searchField换成product

    Processed: 0.009, SQL: 9