Commit 91bda66d87c5d66baf263f621e66e86ae14aee90

Authored by Aresn
Committed by GitHub
2 parents 83b73885 acc6c4a6

Merge pull request #605 from hezhiying/table-filters

添加filterRemote方法,支持用户远程筛选数据
examples/routers/table.vue
... ... @@ -16,7 +16,28 @@
16 16 },
17 17 {
18 18 title: '年龄',
19   - key: 'age'
  19 + key: 'age',
  20 + filters:[
  21 + {
  22 + label: '小学',
  23 + value: '小学'
  24 + },
  25 + {
  26 + label: '中学',
  27 + value: '大学'
  28 + },
  29 + {
  30 + label: '中学',
  31 + value: '中学'
  32 + }
  33 + ],
  34 + filterRemote:function(value,key,column){
  35 + var that = this;
  36 + this.$Notice.open({title:`正在远程过滤${key}`,desc:value,duration:3,onClose:function(){
  37 + that.remoteFilter(value,key,column)
  38 + }})
  39 +
  40 + }
20 41 },
21 42 {
22 43 title: '地址',
... ... @@ -66,6 +87,23 @@
66 87 }
67 88 ]
68 89 }
  90 +
  91 + },
  92 + methods:{
  93 + remoteFilter:function(val,age,column){
  94 + this.data1 = [
  95 + {
  96 + name: '模拟1',
  97 + age: 18,
  98 + address: '北京市朝阳区芍药居'
  99 + },
  100 + {
  101 + name: '模拟2',
  102 + age: 25,
  103 + address: '北京市海淀区西二旗'
  104 + },
  105 + ]
  106 + }
69 107 }
70 108 }
71 109 </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.$parent,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);
... ...