搜索功能：https://blog.csdn.net/bbs11007/article/details/110948483

?

搜索功能我們已經(jīng)實(shí)現(xiàn)了，那么怎么支持大小寫匹配？模糊查詢我們需要用到一個(gè)函數(shù)是：toUpperCase()，

let result = this.pages1.values.filter(row => {//this.pages1.values這個(gè)是表內(nèi)所有數(shù)據(jù)//搜索那列的內(nèi)容，這里搜索name、id等列的內(nèi)容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)

這個(gè)也沒有什么好說的。只是加的位置不同。

?

課外：

VUE的搜索大概寫法：

contains(prop, str) { //打包到服務(wù)器：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這個(gè)是表內(nèi)所有數(shù)據(jù)//搜索那列的內(nèi)容，這里搜索name、id等列的內(nèi)容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("搜索結(jié)果：",this.contains("test0308","test0308"));

你會(huì)發(fā)現(xiàn)如果是大寫的:TEST,你搜索時(shí)輸入test或TEST都搜索出來。但是內(nèi)容是小寫的：test，這個(gè)你輸入test或TEST都搜索不出來。

所以我改成：

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

這樣你會(huì)發(fā)現(xiàn)：test這個(gè)內(nèi)容，輸入test小寫可以搜索出來，但是輸入TEST搜索不出來。這么寫如果含有小寫的話（如Test），只能要嚴(yán)格區(qū)分大小寫，如果沒有小寫（如TEST），全是大寫就不區(qū)分大小寫。

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

這個(gè)問題在.toUpperCase()中，原來它是轉(zhuǎn)換成大寫，也就是說我們this.contains(左,右)這個(gè)左右兩邊對(duì)比不等的問題，我們上面發(fā)現(xiàn)右邊?.toUpperCase()變?yōu)榇髮?#xff0c;而左邊沒有變，所以導(dǎo)致不相等。所以左邊也要?.toUpperCase()，

這樣我們就改成：

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

這樣子左右兩邊都?.toUpperCase()，我們無論輸入大小寫或是大小寫混合，都可以搜索出來，去試試吧。

總結(jié)

以上是生活随笔為你收集整理的搜索功能支持大小写模糊查询的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。