How to use OnRenderRow property of ListView control? Can you please provide an example?

[SharePointReady]

Category

[ ] Enhancement

[ ] Bug

[X] Question

Version

Please specify what version of the library you are using: [ 3.17.0 ]

Expected / Desired Behavior / Question

How to implement the function for OnRenderRow propery of the ListView control?
The example given at the documentation for DetailsList control is not working for ListView control.

Thanks!

[ghost]

Thank you for reporting this issue. We will be triaging your incoming issue as soon as possible.

[github-actions]

Thank you for submitting your first issue to this project.

[patrikhellgren]

Since Fluent UI DetailsList is used under the hood, there are lots of samples available online but you could have a look at the official Fluent UI DetailsList documentation, e.g. DetailsList - Custom item rows.
Nothing special otherwise in @pnp/spfx-controls-react.

[SharePointReady]

Hi Patrik,

Thanks for reply. The example given at the DetailsList - Custom item rows is not working for ListView control. It gives below error.

[SharePointReady]

Hi I figured it out as Patrick said. please see below example.

`private _onRenderRow = (props: any) => {

    // console.log('Row Props: ', props);
    
    const customStyles: Partial<IDetailsRowStyles> = {};
    customStyles.root = { backgroundColor: '#ffe680' };

    return props.item.isEmailResponse ? <DetailsRow {...props} styles={customStyles} /> : <DetailsRow {...props} />;
};`

Thanks,
Jemi