如何用iView Table实现长尾词过滤功能？

本文共计259个文字，预计阅读时间需要2分钟。

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

javascriptexport default { data() { return { columns: [ { title: 'Name', key: 'name' }, // 过滤器配置 { title: 'Status', key: 'status', filters: [ { text: 'Active', value: 'active' }, { text: 'Inactive', value: 'inactive' } ], filterMethod(value, row) { return row.status===value; } } ] } }}

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的名字

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

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