css – Hide Sharepoint row with JSON

There is no predefined class given by Microsoft to hide the complete row using additionalRowClass.

Below are couple of workarounds you can consider:

1. Create a list view with filter: Recommended

Create a new list view with (Me) filter on Person column.


enter image description here

More details at: Filter your SharePoint view to show documents requiring your action

Additionally, You can also set it as a default view if you want.

2. Use rowFormatter in JSON:

You can use rowFormatter instead of additionalRowClass which gives you more control to format list view.

Note: If you are using it you have to design your list view completely and you will loose some out of the box functionalities of SharePoint.

Similar Sample: Custom Header – In this sample, row is hiddedn based on rowIndex. Similarly you can apply your condition based on Person column to hide the row.

3. Use custom class:

If there is any class which has CSS of display: none; & it is loaded on the page where your list view is added, you can use that class in additionalRowClass like:

"additionalRowClass": "=if(@me == ($Person.email), 'ms-bgColor-neutralLight', '<class-with-custom-css>')"

You can also inject custom CSS (classes) on modern pages using SPFx extension & use those in your JSON (Injecting CSS in not recommended though).