假分页数据处理 次要应用filter

页面

<tab-list    :headerProp="headerProp"    :type="{ type: 'index', name: '序号' }"    :pager="pager"    :list="status | filterList(shipCode,callCode,username,list,pager)"    :loading="loading"    @onChangePageInfo="handleChangePageInfo"    maxWidth="1200"    maxHeight="570"</tab-list>

filter

filters:{    //字典解决    filtersShipType(type,dictData){      if(dictData['ship_type'] && dictData['ship_type'][type]){        return dictData['ship_type'][type]['title']      }      return ''    },    //过滤分页    filterList(status,shipCode,callCode,username,list,pager){      let arr=[]      function isContain(str,val){//str被检索的字符串, val子串        let reg = new RegExp(val);//,'g'  g全局匹配;          return reg.test(str)      }      list.map(item=>{        let checkStatus=true,checkShipCode=true,checkCallCod=true,checkUsername=true        if(status && item.status!=status) checkStatus=false        if(shipCode && !isContain(item.shipCode,shipCode)) checkShipCode=false        if(callCode && !isContain(item.callCode,callCode)) checkCallCod=false        if(username && !isContain(item.username,username)) checkUsername=false        if(checkStatus && checkShipCode && checkCallCod && checkUsername){          arr.push(item)        }      })      return arr.slice((pager.currentPage-1)*pager.pageSize,pager.currentPage*pager.pageSize)    }  },

办法分页解决

methods:{//假分页 搜寻解决    handleSearch(){      this.status=this.tableQuery.status      this.shipCode=this.tableQuery.shipCode      this.callCode=this.tableQuery.callCode      this.username=this.tableQuery.username      this.pager.currentPage=1      let te=this.$options.filters['filterList'];      let resultFilter=te(this.status,this.shipCode,this.callCode,this.username,this.list,this.pager);      this.pager.total=resultFilter.length    },    //假分页 页码解决    handleChangePageInfo(pager) {      this.pager = pager;    },}

初始化列表total

created() {    this.InitInnerShipEntityList().then(res=>{      this.pager.total=res.length      this.list=res    })  },