首页 > 编程 > JavaScript > 正文

iview的table组件自带的过滤器实现

2019-11-19 11:11:27
字体:
来源:转载
供稿:网友

iview的table组件自带的过滤器实现

iview框架的table组件自带的过滤器的使用方法:

<script> export default {  data () {    return {      columns: [        {          title: 'Name',          key: 'name'        },     //过滤器     //通过给 columns 数据的项,设置 filters,可进行筛选,filters 接收一个数组,必须指定一个筛选函数filterMethod                                  {          title: 'Age',          key: 'age',          filters: [            {              label: 'Greater than 25',              value: 1            },            {              label: 'Less than 25',              value: 2            }          ],          filterMultiple: false,          filterMethod (value, row) {            if (value === 1) {              return row.age > 25;            } else if (value === 2) {              return row.age < 25;            }          }        }      ]     }    }  }

上面的方法是iview的demo,但是这样不能实现分页时筛选,只能筛选当前页,想要实现分页筛选,只需在filterMethod函数的

第一行加上一段

this.age = value // age变量为key的名字

这样就可以实现分也时筛选了

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持武林网。

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表