Commit 12bcf7bd14d0ca8f098ff7ad293e4f0f2fd8f872

Authored by H
1 parent 15b72d31

添加 remoteFilter方法,支持用户远程筛选数据

examples/routers/table.vue
... ... @@ -15,7 +15,28 @@
15 15 },
16 16 {
17 17 title: '年龄',
18   - key: 'age'
  18 + key: 'age',
  19 + filters:[
  20 + {
  21 + label: '小学',
  22 + value: '小学'
  23 + },
  24 + {
  25 + label: '中学',
  26 + value: '大学'
  27 + },
  28 + {
  29 + label: '中学',
  30 + value: '中学'
  31 + }
  32 + ],
  33 + filterRemote:function(value,key,column){
  34 + var that = this;
  35 + this.$Notice.open({title:`正在远程过滤${key}`,desc:value,duration:3,onClose:function(){
  36 + that.remoteFilter(value,key,column)
  37 + }})
  38 +
  39 + }
19 40 },
20 41 {
21 42 title: '地址',
... ... @@ -45,6 +66,23 @@
45 66 }
46 67 ]
47 68 }
  69 +
  70 + },
  71 + methods:{
  72 + remoteFilter:function(val,age,column){
  73 + this.data1 = [
  74 + {
  75 + name: '模拟1',
  76 + age: 18,
  77 + address: '北京市朝阳区芍药居'
  78 + },
  79 + {
  80 + name: '模拟2',
  81 + age: 25,
  82 + address: '北京市海淀区西二旗'
  83 + },
  84 + ]
  85 + }
48 86 }
49 87 }
50 88 </script>
... ...
src/components/table/table.vue
... ... @@ -496,6 +496,9 @@
496 496 },
497 497 filterData (data, column) {
498 498 return data.filter((row) => {
  499 + if(typeof column.filterRemote == 'function'){ //如果定义了远程过滤方法则忽略此方法
  500 + return true;
  501 + }
499 502 let status = !column._filterChecked.length;
500 503 for (let i = 0; i < column._filterChecked.length; i++) {
501 504 status = column.filterMethod(column._filterChecked[i], row);
... ... @@ -505,6 +508,11 @@
505 508 });
506 509 },
507 510 filterOtherData (data, index) {
  511 + let column = this.cloneColumns[index];
  512 + if(typeof column.filterRemote == 'function'){
  513 + column.filterRemote.call(this.currentContext,column._filterChecked,column.key,column);
  514 + }
  515 +
508 516 this.cloneColumns.forEach((col, colIndex) => {
509 517 if (colIndex !== index) {
510 518 data = this.filterData(data, col);
... ...