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

iview的table组件自带的过滤器实现iview框架的table组件自带的过滤器的使用方法：<script>ex

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

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

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