React Material Table rowData is undefined

Question

In my project when onChange input value in row,I need to get props.rowData in material table props but I get rowData as undefined. How can I solve this issue.

 "material-table": "1.36.6",
 "react": "16.8.3",
 "react-dom": "16.8.3",



 const columns = [{
                title:  <Translate id='discount' />,
                field: 'discount',
                editComponent:props => {
                    return(
                        <Translate>
                            {({ translate }) =>
                                <TextField
                                    className='min-w-80'
                                    type={'text'}
                                    placeholder={translate('discount')}
                                    margin="dense"
                                    value={props.value === props ? '' : props.value}
                                    onChange={event => {
                                        props.onChange(event.target.value)
                                    }}
                                />
                            }
                        </Translate>
                    );
                },
            },
            {
                title: <Translate id='total_price' />,
                field: 'total_price',
                editComponent: props => {
                    return(
                        <Translate>
                            {({ translate }) =>
                                <TextField
                                    className='min-w-80'
                                    type={'text'}
                                    placeholder={translate('total_price')}
                                    margin="dense"
                                    value={props.value === props ? '' : props.value}
                                    onChange={event => {
                                        props.onChange(event.target.value)
                                    }}
                                />
                            }
                        </Translate>
                    );
                }];

How can i get props.rowData when discount input on changed ?

Answer 1

You could do it like this:

const columns = [{
            title:  <Translate id='discount' />,
            field: 'discount',
            editComponent:props => {
                const discount = props.rowData ? props.rowData.total_price / 20 : ""
                return(
                    <Translate>
                        {({ translate }) =>
                            <TextField
                                className='min-w-80'
                                type={'text'}
                                placeholder={translate('discount')}
                                margin="dense"
                                value={discount}
                                onChange={event => {
                                    props.onChange(event.target.value)
                                }}
                            />
                        }
                    </Translate>
                );
            },
        },
        {
            title: <Translate id='total_price' />,
            field: 'total_price',
            editComponent: props => {
                return(
                    <Translate>
                        {({ translate }) =>
                            <TextField
                                className='min-w-80'
                                type={'text'}
                                placeholder={translate('total_price')}
                                margin="dense"
                                value={props.value === props ? '' : props.value}
                                onChange={event => {
                                    props.onChange(event.target.value)
                                }}
                            />
                        }
                    </Translate>
                );
            }];

This will override the discount field to be a percentage of the total field.