Programaticaly Hide/Show Columns

[fwarren]

How can I change column visibility after the page is loaded. I tried changing the 3rd column with column[2].visible = true but visibility did not change.

[syshex]

Hey! You can't at this moment.
Want to give it a try at a PR for that ?

[fwarren]

I may do a PR at some point. I think you would have to specify column by number not title or name. It is possible to have a column show up multiple times and then you would only be able to toggle the first occurrence.

I have been able to toggle the column programaticaly. the reactive column data that is passed into the table is used to build a reactive data structure dispalyCols.

The first thing I did is added ref="mytable" to <vue-bootstrap-table> and then I toggle the visibility directly.

this.$refs.mytable._data.displayCols[2].visible = true

I know that directly manipulating a child component is not a best practice, but it works.