Set filter options on vue-good-table programmatically

Question

How can one change the value that is displayed in the UI filter elements(input, dropdown etc) in vue-good-table programmatically?

For example if I call: this.$set(this.table.columnsFilters, 'name', 'bob')

I want the value in the HTML input field 'name' to display bob.

Unfortunatly the settting the values as i described above does not work

Answer 1

See: https://github.com/xaksis/vue-good-table/issues/475

Official recommended method of doing this for version >= 2.17.5:

this.$set(this.columns[foundIndex].filterOptions, 'filterValue', value);

If you want to have it done using $route query params:

for (var key in this.$route.query){
    var field = key;
    let foundIndex = this.columns.findIndex((c) => {
      return c.field == field
    });

    if (foundIndex !== -1 ){
      this.$set(this.columns[foundIndex].filterOptions, 'filterValue', this.$route.query[key]);
    }
}