javascript - VueJS Element vue-data-tables Search box filter with range -

i using vuejs 2.0 along http://element.eleme.io , https://njleonzhang.github.io/vue-data-tables. been trying figure out how can ranged search (x y) https://njleonzhang.github.io/vue-data-tables/#/searchboxfilter unable figure out , not find examples. feel can done filterfunction, unsure. or maybe add more text inputs can take 2 numbers, , pass values filterfunction? not sure if has example on how done, extremely appreciate it. below have far, removed tried, not confuse anyone.

<template>   <data-tables ref="multipletable" :data="tabledata" :pagination-def="paginationdef" :search-def="searchdef" @filtered-data="handlefiltereddata"  @selection-change="handleselectionchange">      <el-row slot="custom-tool-bar" style="margin-bottom: 10px">       <el-col>         <el-button @click="hidefiltereddata()" type="primary">delete filtered</el-button>         <el-button @click="hideselectiondata()" type="primary">delete selected</el-button>       </el-col>     </el-row>        <el-table-column       type="selection"       width="55">     </el-table-column>      <el-table-column prop="id" label="id" sortable="custom">     </el-table-column>      <el-table-column prop="title" label="title" sortable="custom">     </el-table-column>   </el-table-column></data-tables> </template> <script> import axios 'axios' export default {  data() {   return {    tabledata: [],    filtereddata: [],    paginationdef: {     pagesize: 10,     pagesizes: [10, 20, 50, 100],    },    searchdef: {     props: ['title', 'id']    },    multipleselection: []   }  },  mounted() {   axios.post('select.py', {    table: 'master',    where: [     {      hidden: 0,      deal_website: 'dailysteals'     }    ]   })   .then(response => {    this.tabledata = response.data   })   .catch(function (error) {    console.log(error);   });  },  methods: {   handlefiltereddata(filtereddata) {    this.filtereddata = filtereddata   },   hidefiltereddata(){    this.filtereddata.foreach(function(item){     console.log('id: ' + item.title);    })   },   handleselectionchange(val) {    this.multipleselection = val;   },   hideselectiondata(){    this.multipleselection.foreach(function(item){     console.log(item.id)    })   }  } } </script>