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