Vue Data GridAG Grid Vue Error #101

Component Name Not Registered Copy Link

A column or grid option asked for a component by name, setting <propertyName> to the string <componentName>, and the grid could not find that name when it came to render. The cell falls back to the grid's default component.

The grid tells two cases apart here. Naming a built-in component whose module is not registered raises error #200 with the module to register, so arriving at #101 means the grid believes this is your own component. That leaves two causes, and the message's Did you mean suggestions usually settle which:

• A typo, or a mismatch in case. Names are matched exactly, so myCellRenderer and MyCellRenderer are different components.
• The component was never registered, or was registered on a different grid than the one rendering this column.

Register it by name Copy Link

Vue resolves the name through Vue's own registries rather than the grid's components option. Register the component globally with app.component, locally through the enclosing component's components option, or expose it with defineExpose when using script setup:

import MyCellRenderer from './MyCellRenderer.vue';

app.component('MyCellRenderer', MyCellRenderer);

The grid's components option still has an effect in Vue, but it maps one name to another rather than a name to a component, so whatever it points at has to be registered with Vue as well.

See Registering Custom Components for the full set of forms.

Or skip the name Copy Link

Referencing the component directly avoids this class of error, because a wrong name becomes a compile-time or import error rather than something found at render:

<ag-grid-vue
    :columnDefs="columnDefs"
    /* other grid options ... */>
</ag-grid-vue>

this.columnDefs = [
    { field: 'status', cellRenderer: MyCellRenderer },
];

Registering by name is still worth it where the name has to come from configuration or data, such as a saved layout or a server response, since a string is all you have in that case.

If several grids need it Copy Link

The components option applies to one grid, and a grid that defines its own map does not see another grid's. To make a component available to every grid, register it through Global Grid Options with the deep merge strategy, so a grid's own map is merged with the global one rather than replacing it. All component types share one registry, so names must be unique across it.