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的名字
這樣就能夠實現分也時篩選了框架

相關文章
相關標籤/搜索