前端搜索

记录1

后端接口返回一个list列表，然后前端模拟实时搜索 用的是elementui组件

 <el-input placeholder="输入银行名称检索"
                    v-model.lazy="filterText"
                    ref="searchInput"
                    type="search"
                    @keyup.enter.native="filterNode"
                    @focus="changeText()"></el-input>

接口过来的list付给一个新的 数组 ，专门用来做搜索的处理，用watch监测输入的值用filter进行过滤 返回，中间的if判断是为了处理字母大小写，至于else（输入内容撤销后，没有搜索的内容再重新赋值）代码如下：

    watch: {
      filterText: function (data) {
        if (data !== '') {
          this.$nextTick(function () {
            this.loanLists = this.loanLists2.filter(function (item) {
              if (item.bank_name.toLowerCase().indexOf(data.toLowerCase()) != -1) {
                console.log(item);
                return item
              }
            })
          })
        } else {
          this.loanLists = this.loanLists2
        
        }
      }
    }

记录2

首先是并列关系 选完点确定才有搜索结果；把返回的数据存起来，使用存起来的数据做处理，直接上代码

      //  过滤事件
      dataListChange(val){
        this.loadingShow.isloading = true
        this.tabData=JSON.parse(localStorage.getItem('tabData'))
        let newArr = []
        for (let i = 0; i < this.tabData.length; i++) {
          let arr = this.tabData[i].list
          newArr.push(this.tabData[i])
          if (val.unitFilter !== undefined && val.unitFilter !== '' && val.unitFilter !== '全部单位') {
            arr = arr.filter(item => {
              return (item.sqdwdesc == val.unitFilter)
            }, this)
          }
          if ( val.moneyFilter!==undefined && val.moneyFilter !== '' && val.moneyFilter !== '全部金额') {
            let temp = val.moneyFilter.split('-')
            if (arr.length > 0) {
              arr = arr.filter(item => {
                return temp[1] > parseFloat(item.sqjecny) && parseFloat(item.sqjecny) >= temp[0]
              })
            }
          }
          if (val.fzrFilter!==undefined && val.fzrFilter !== ''  && val.fzrFilter !== '全部负责人') {
            arr = arr.filter(item => {
              return item.sqrdesc == val.fzrFilter
            }, this)
          }
          if (val.searchText!==undefined && val.searchText !== '') {
            if (arr.length > 0) {
              arr = this.util.arrayFilter(arr, val.searchText)
            }
          }
          newArr[i].list = arr
        }
        this.tabData = newArr
        let self=this
        setTimeout(function(){
          self.loadingShow.isloading = false
        },500)
      }