搜索功能支持大小写模糊查询

搜索功能：blog.csdn.net/bbs11007/ar…

 

搜索功能我们已经实现了，那么怎么支持大小写匹配？模糊查询我们需要用到一个函数是：toUpperCase()，

let result = this.pages1.values.filter(row => {//this.pages1.values这个是表内所有数据
              //搜索那列的内容，这里搜索name、id等列的内容
              return row.name.indexOf(this.search1.toUpperCase()) > -1 
                || row.id.indexOf(this.search1.toUpperCase()) > -1 
                || row.code.indexOf(this.search1.toUpperCase()) > -1 
                || row.note.indexOf(this.search1.toUpperCase()) > -1;
            });

 

js中的写法是：

if (td.innerHTML.toUpperCase().indexOf(filter) > -1 || td1.innerHTML.toUpperCase().indexOf(filter) > -1 || td2.innerHTML.toUpperCase().indexOf(filter) > -1) 

这个也没有什么好说的。只是加的位置不同。

 

课外：

VUE的搜索大概写法：

contains(prop, str) { //打包到服务器：
            if (prop === null || prop === undefined) {
                return false;
            } else {
                return prop.indexOf(str) > -1;
                //如果需要大小写匹配
                //return prop.indexOf(str.toUpperCase()) > -1;
            }
        },

 let result = this.pages1.values.filter(row => {//this.pages1.values这个是表内所有数据
              //搜索那列的内容，这里搜索name、id等列的内容
               return this.contains(row.name, this.search1) 
                || this.contains(row.id, this.search1) 
                || this.contains(row.code, this.search1) 
                || this.contains(row.note, this.search1) 
            });

 

大小写模糊匹配，如果这么写：

return prop.indexOf(str.toUpperCase()) > -1;

打印看下：

console.log("搜索结果：",this.contains("test0308","test0308"));

你会发现如果是大写的:TEST,你搜索时输入test或TEST都搜索出来。但是内容是小写的：test，这个你输入test或TEST都搜索不出来。

所以我改成：

return prop.indexOf(str.toUpperCase()) > -1 || prop.indexOf(str) > -1;

这样你会发现：test这个内容，输入test小写可以搜索出来，但是输入TEST搜索不出来。这么写如果含有小写的话（如Test），只能要严格区分大小写，如果没有小写（如TEST），全是大写就不区分大小写。

思考：这是什么原因？怎么改？

这个问题在.toUpperCase()中，原来它是转换成大写，也就是说我们this.contains(左,右)这个左右两边对比不等的问题，我们上面发现右边 .toUpperCase()变为大写，而左边没有变，所以导致不相等。所以左边也要 .toUpperCase()，

这样我们就改成：

 return prop.toUpperCase().indexOf(str.toUpperCase()) > -1; 

这样子左右两边都 .toUpperCase()，我们无论输入大小写或是大小写混合，都可以搜索出来，去试试吧。