Applying Grid Renderer
To use the renderer function in the grid, you can use the function by passing the renderer property you want to apply to the renderer props of the column tag to which you want to apply the renderer.
Below is a simple example code that applies an image renderer.
<template>
<div style="width: 1000px; height: 400px">
<RealGridVue
ref="gridRef"
:rows="[['KRW'], ['USD']]"
:auto-generate-field="true">
<RGDataColumn
field-name="Monetary"
:width="100"
:renderer="{
type:'image',
imageCallback: (grid: RealGrid.GridBase, cell: RealGrid.GridCell) => {
return `${cell.value}.png`
},
imageHeight: 30,
imageWidth: 30,
}"/>
</RealGridVue>
</div>
</template>
You can check how to apply the renderer in Image Renderer Example.