HI, I managed to resolve by updating this line: onClick={(e) => {this.onClickTag(e, item); return false;}} Now it is working!

Hi again, I finally I managed to make the dropdown react component work in my app. Now I have another dilema. I need to find a way to insert data into the dropdown. This is how my component looks like now: import * as React from 'react'; import { Dropdown, DropdownMenuItemType } from "office-ui-fabric-react/lib/Dropdown"; import { BaseComponent } from "office-ui-fabric-react/lib/Utilities"; import styles from './Footer.module.scss'; const footer = (props) => { return ( <div className={styles.footer}> <div className={styles.main}> <div className="ms-Grid"> <div className="ms-Grid-row"> <div className="ms-Grid-col ms-sm6 ms-md8 ms-lg10"> <p>Other text</p> </div> <div className="ms-Grid-col ms-sm6 ms-md4 ms-lg2"> <Dropdown placeHolder="select a option" options={[ { key: 'Header', text: 'Actions', itemType: DropdownMenuItemType.Header }, { key: 'A', text: 'Option a', title: 'I am option a.' }, { key: 'B', text: 'Option b' }, { key: 'C', text: 'Option c' }, { key: 'D', text: 'Option d' }, { key: 'E', text: 'Option e' } ]} /> </div> </div> </div> </div> </div> ) } export default footer; I found a sample at MS home page that show how to create mockupDataProvider: import { ISPList } from './HelloWorldWebPart'; export default class MockHttpClient { private static _items: ISPList[] = [{ Title: 'Mock List', Id: '1' }, { Title: 'Mock List 2', Id: '2' }, { Title: 'Mock List 3', Id: '3' }]; public static get(): Promise<ISPList[]> { return new Promise<ISPList[]>((resolve) => { resolve(MockHttpClient._items); }); } } And how to implement it: private _renderList(items: ISPList[]): void { let html: string = ''; items.forEach((item: ISPList) => { html += ` <ul class="${styles.list}"> <li class="${styles.listItem}"> <span class="ms-font-l">${item.Title}</span> </li> </ul>`; }); const listContainer: Element = this.domElement.querySelector('#spListContainer'); listContainer.innerHTML = html; } As you see in the code sample, it is using a forEach to loop through the objects in the ISPList array. My issue is how I replace this (from the dropdown component): options={[ { key: 'Header', text: 'Actions', itemType: DropdownMenuItemType.Header }, { key: 'A', text: 'Option a', title: 'I am option a.' }, { key: 'B', text: 'Option b' }, { key: 'C', text: 'Option c' }, { key: 'D', text: 'Option d' }, { key: 'E', text: 'Option e' } ]} With a loop like in the MS sample? Here is the link to the MS sample for more details: Link