New to Kendo UI for Vue? Start a free 30-day trial
Dynamic Columns Generation
The Kendo UI for Vue Native Grid allows the user to dynamically update the columns inside the component. You can dynamically change the number of the Grid columns using a computed property that returns the new columns' definition:
columns() {
const columns = [
{
field: "id",
width: "150px",
},
];
for (let c = 1; c < this.numberOfColumns; c++) {
columns.push({
field: "Field-" + c.toString(),
width: "150px",
});
}
return columns;
}Example
View Source
Change Theme:
