0

I am using 

import { Nav } from 'office-ui-fabric-react';
function CustomNav(props) {
  return <Nav groups={groups} selectedKey={selectedKey} onLinkClick={handleLinkClick} data-myTag="hello" />;
}

For nav object, I want to add custom html attributes such as data-myTag. How do I add this attribute to the button that is added to the DOM by this Nav object.

Ronak SHAH
  • 171
  • 2
  • 11

1 Answers1

0

Based on looking at the source where Nav is rendered, it unfortunately looks like it isn't possible to add data tags to the container.

Your best bet would likely be to either:

  • Put the data attributes on a div you return from your CustomNav component, or
  • Create a pull request with Fabric itself which renders those data attributes
JD Huntington
  • 348
  • 1
  • 5
  • You are partially correct. I found another approach by adding a custom button to the nav headers. This was suggested by my friend's colleague. – Ronak SHAH Jun 23 '20 at 05:08