Renders

Custom rendering can be used to change the display format of the displayed data.

Usage

renders={RENDERS}

Example 1

const RENDERS: Renders = {
	state: {
		table: {
			alpha2code: ({ value }: any) => (
				<img
					width={50}
					src={`https://raw.githubusercontent.com/lipis/flag-icons/main/flags/4x3/${value}.svg`}
					alt={value}
				/>
			),
		},
	},
};

For entity: state, I want to display the state flag in the table under the alpha2code value instead of just the official state abbreviation.

Example 2

Another problem that this feature could solve is the following: You want to display only the owner's last name in the table for the entity car instead of the owner's id. Solution:

const RENDERS: Renders = {	
	car: {
		table: {
			user: (props: any) => <div>{props.object.user?.lastname}</div>,
		},
	},
};

Last updated