Vue Data Grid

Edit Components

vue logo

A Cell Editor Component is the UI that appears, normally inside the Cell, that takes care of the Edit operation. You can select from the Provided Cell Editors or create your own Custom Cell Editor Components.

The example below shows some Provided Editor Components and some Custom Editor Components.

Custom Components

When a Vue component is instantiated the grid will make the grid APIs, a number of utility methods as well as the cell and row values available to you via a params object.

With Vue 2 and Vue 3 you can access the params object via this.params in the usual methods (lifecycle hooks, methods etc), and with Vue 3's setup via props.params.

The editor params interface is as follows: