Cell as native component

Revogrid provide a way to render native components inside of cells.

WARNING

If you are aiming for the faster render we are recommending to stick with native VNode render.

TIP

Check ColumnDataSchemaModel for mode information about input types.

// App.tsx
import { createContext, useContext } from 'react';
import { type ColumnDataSchemaModel, RevoGrid, Template } from '@revolist/react-datagrid';

/**
 * Custom cell component
 */
const Cell = ({ model, prop }: ColumnDataSchemaModel) => {
  return <div><strong>{model[prop]}</strong></div>;
};

function App() {
  const columns = [
    {
      prop: 'name',
      name: 'First',
      cellTemplate: Template(Cell),
    },
  ];
  const source = [
    {
      name: '1',
      details: 'Item 1',
    },
  ];
  return (
    <>
      <RevoGrid columns={columns} source={source} />
    </>
  )
}

export default App