office-ui-fabric-react
Version:
Reusable React components for building experiences for Office 365.
1 lines • 1.27 kB
JavaScript
module.exports = "/* tslint:disable:no-unused-variable */\nimport * as React from 'react';\n/* tslint:enable:no-unused-variable */\nimport {\n Breadcrumb, IBreadcrumbItem\n} from '../../../../Breadcrumb';\n\nexport class BreadcrumbBasicExample extends React.Component<any, any> {\n constructor() {\n super();\n this._onBreadcrumbItemClicked = this._onBreadcrumbItemClicked.bind(this);\n }\n\n public render() {\n return (\n <Breadcrumb\n items={ [\n {text: 'Files', 'key': 'Files', onClick: this._onBreadcrumbItemClicked},\n {text: 'This is folder 1', 'key': 'f1', onClick: this._onBreadcrumbItemClicked},\n {text: 'This is folder 2', 'key': 'f2', onClick: this._onBreadcrumbItemClicked},\n {text: 'This is folder 3', 'key': 'f3', onClick: this._onBreadcrumbItemClicked},\n {text: 'This is folder 4', 'key': 'f4', onClick: this._onBreadcrumbItemClicked},\n {text: 'This is folder 5', 'key': 'f5', onClick: this._onBreadcrumbItemClicked},\n ] }\n maxDisplayedItems={ 3 } />\n );\n }\n\n private _onBreadcrumbItemClicked(ev: React.MouseEvent<HTMLElement>, item: IBreadcrumbItem) {\n console.log(`Breadcrumb item with key \"${ item.key }\" has been clicked.`);\n }\n\n}\n";