How can I dynamically populate listColumns in vue-tables-2?

Question

Let's say that I have an array of categories names available via a prop.

In vue-tables-2 how can I dynamically populate a category filter in the listColumns option ?

listColumns: {
  type: [{
    id: 1,
    text: 'User'
  },
  {
    id: 2,
    text: 'Admin'
  }],
  category: function () {
    this.categories.map((cat, index) => { return { id: index, text: cat } })
  }
}

Doing like so returns the following error:

[Vue warn]: Error in render: "TypeError: _this.opts.listColumns[column].filter is not a function"

Answer 1

You can insert your props in the options.

options: {
  filterByColumn: true,
    listColumns: {
        type: this.categories
    }
}