Is there any option available in DataGrid MUI to export columns with renderCell on a complex object?

Question

I am exporting DataGrid @mui/x-data-grid table using CustomToolbar

I have one of the columns as below

        {
            field: 'industry_type',
            headerName: 'Industry',
            renderCell: (params) => {
                const industry = params.row.industry_type;
                return (
                    <>
                        <p>{`${industry.code}- ${industry.value}`} </p>
                    </>
                );
            }
        }

The csv file downloaded from export option gives the value as [object Object]

How do I get the actual value in csv downloaded file? I need help in fixing this. Thanks.

Dees

Answer 1

Does valueGetter work for exports?

        {
            field: 'industry_type',
            headerName: 'Industry',
            renderCell: (params) => {
                const industry = params.row.industry_type;
                return (
                    <>
                        <p>{`${industry.code}- ${industry.value}`} </p>
                    </>
                );
            },
            valueGetter: (params) => `${params.row.industry_type.code}- ${params.row.industry_type.value}`,
        }

Red

Confirmed, valueGetter works for exports. In MUI4 v at least though, note that valueGetter supercedes the renderCell, so you would lose the <p> breaks in your render - which in this example you probably don't need anyway, but just a heads up. – Barbee

Answer 2

According to the MUI data grid docs here, you can provide the valueFormatter

{
        field: 'industry_type',
        headerName: 'Industry',
        renderCell: (params) => {
            const industry = params.row.industry_type;
            return (
                <>
                    <p>{`${industry.code}- ${industry.value}`} </p>
                </>
            );
        },
        valueFormatter: ({ value }) => `${value.industry_type.code}- ${value.industry_type.value}`,
    }

Notable