Custom filter: undefined custom function in filters configuration property

[juaniyofm]

I'm triying to filter by date field. For that, I'm using the custom filters functionality:

In the template:

<input type="date" class="form-control col-5" v-model="filters.birthday.value.min"
                                           :max="filters.birthday.value.max"/>
                                    <span class="col-1 text-center">-</span>
                                    <input type="date" class="form-control col-5" v-model="filters.birthday.value.max"
                                           :min="filters.birthday.value.min">

<v-table :data="data" :filters="filters" ... >

In the filters object:

birthday: {
                   value: { min: '', max: '' },
                    custom: this.birthdayFilter
                 }

In the created hook:

birthdayFilter (filterValue, row) {
                return row.birthday >= filterValue.min && row.birthday <= filterValue.max
            }

When the page is rendered, it throws errors:

• Error in data(): "TypeError: Cannot read property 'birthdayFilter' of undefined"
• Property or method "filters" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property

The basic filters work fine in the page, custom filters don't. I have followed the official documentation (https://tochoromero.github.io/vuejs-smart-table/filtering/#custom-filters) and my Vue version is 2.6.12

Thanks.

[adamjw3]

did you get this working?