@uiw/doc/web/static/js/5740.4ccc8290.chunk.js

UIW documentation website.

(self.webpackChunkwebsite=self.webpackChunkwebsite||[]).push([[5740],{4934:e=>{function r(e){var r=new Error("Cannot find module '"+e+"'");throw r.code="MODULE_NOT_FOUND",r}r.keys=()=>[],r.resolve=r,r.id=4934,e.exports=r},5301:(e,r,t)=>{"use strict";t.d(r,{Z:()=>_});var a=t(8573),n=t(6320),u=t(8563),c=t(7622),m=t(7937);const o={docinfo:"index_docinfo__3Vx8S",markdown:"index_markdown__hcQCp",markdownWrap:"index_markdownWrap__t60jR"};var i=t(4760);function l(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};const{path:r}=e,t=/^http/.test(r||"")?r:"https://github.com/uiwjs/uiw/blob/master/".concat(r);return(0,i.jsxs)("div",{className:o.docinfo,children:["\u72af\u4e86\u9519\u8bef\u8fd8\u662f\u60f3\u5bf9\u6587\u4ef6\u505a\u51fa\u8d21\u732e\uff1f",t&&(0,i.jsx)("a",{href:t,target:"_blank",rel:"noopener noreferrer",children:"\u5728Github\u4e0a\u7f16\u8f91\u672c\u9875\uff01"}),(0,i.jsx)("br",{}),(0,i.jsx)("a",{href:"https://github.com/uiwjs/uiw/issues",target:"_blank",rel:"noopener noreferrer",children:"\u53cd\u9988\u5efa\u8bae"}),(0,i.jsx)(m.Divider,{type:"vertical"}),(0,i.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/uiwjs/uiw/issues/new",children:"\u63d0\u4ea4bug"}),(0,i.jsx)(m.Divider,{type:"vertical"}),(0,i.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/uiwjs/uiw",children:"Github"}),(0,i.jsx)(m.Divider,{type:"vertical"}),(0,i.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/kktjs/kkt",children:"kkt"}),(0,i.jsx)(m.Divider,{type:"vertical"}),(0,i.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"https://github.com/kktjs/kkt-ssr",children:"@kkt/ssr"}),(0,i.jsx)(m.Divider,{type:"vertical"}),(0,i.jsx)("a",{target:"_blank",rel:"noopener noreferrer",href:"http://uiw.gitee.io",children:"\u56fd\u5185\u955c\u50cf"})]})}const d=n.ZP.Preview,b=n.ZP.Code,s=n.ZP.Toolbar,f=e=>{var r,t;let{node:c,components:m,data:o,...l}=e;const f=(0,a.useRef)(null),{headings:_,headingsList:p,...y}=l;(0,a.useEffect)((()=>{if(f.current){const e=f.current.parentElement;e&&e.parentElement&&e.parentElement.replaceChild(f.current,e)}}),[f]);const h=null===c||void 0===c||null===(r=c.position)||void 0===r?void 0:r.start.line,I=null===c||void 0===c||null===(t=c.data)||void 0===t?void 0:t.meta,B=(0,u.Mx)(I)||String(h),E=m["".concat(B)];if(B&&"function"===typeof E){const e=o[B].value||"",r=(0,u.aE)(I||"");return(0,i.jsxs)(n.ZP,{ref:f,children:[(0,i.jsx)(d,{style:{background:r.bg||"transparent"},children:(0,i.jsx)(E,{})}),(0,i.jsx)(s,{text:e,children:r.title||"Example"}),(0,i.jsx)(b,{children:(0,i.jsx)("pre",{...y})})]})}return(0,i.jsx)("code",{...y})};function _(e){return(0,i.jsxs)(a.Fragment,{children:[(0,i.jsx)(c.Z,{className:o.markdownWrap,source:e.source||"",disableCopy:!0,wrapperElement:{"data-color-mode":"light"},components:{code:r=>(0,i.jsx)(f,{...e,...r})}}),(0,i.jsx)(l,{path:e.path})]})}},1067:(e,r,t)=>{"use strict";t.r(r),t.d(r,{default:()=>c});const a={components:{21:function(){var e,r=(e=t(8573))&&e.__esModule?e:{default:e},a=t(7937);return function(){return r.default.createElement(a.Breadcrumb,null,r.default.createElement(a.Breadcrumb.Item,null,"\u9996\u9875"),r.default.createElement(a.Breadcrumb.Item,{separator:">"},"\u6d3b\u52a8\u7ba1\u7406"),r.default.createElement(a.Breadcrumb.Item,null,"\u6d3b\u52a8\u5217\u8868"),r.default.createElement(a.Breadcrumb.Item,{active:!0},"\u6d3b\u52a8\u8be6\u60c5"))}}(),41:function(){var e,r=(e=t(8573))&&e.__esModule?e:{default:e},a=t(7937);return function(){return r.default.createElement("div",null,r.default.createElement(a.Breadcrumb,null,r.default.createElement(a.Breadcrumb.Item,null,r.default.createElement("a",{href:"#"},"Home")),r.default.createElement(a.Breadcrumb.Item,{separator:">"},r.default.createElement("a",{href:"#"},"Library")),r.default.createElement(a.Breadcrumb.Item,{active:!0},"Data")),r.default.createElement(a.Divider,null),r.default.createElement(a.Breadcrumb,{separator:"#"},r.default.createElement(a.Breadcrumb.Item,null,r.default.createElement("a",{href:"#"},"Home")),r.default.createElement(a.Breadcrumb.Item,{separator:r.default.createElement("span",null,"+")},r.default.createElement("a",{href:"#"},"Home")),r.default.createElement(a.Breadcrumb.Item,{separator:r.default.createElement(a.Icon,{type:"home",verticalAlign:"baseline"})},r.default.createElement("a",{href:"#"},"Icon")),r.default.createElement(a.Breadcrumb.Item,{separator:">"},r.default.createElement("a",{href:"#"},"Library")),r.default.createElement(a.Breadcrumb.Item,{active:!0},"Data")))}}(),70:function(){var e,r=(e=t(8573))&&e.__esModule?e:{default:e},a=t(7937);function n(e){return n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},n(e)}function u(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);r&&(a=a.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),t.push.apply(t,a)}return t}function c(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{};r%2?u(Object(t),!0).forEach((function(r){m(e,r,t[r])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):u(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))}))}return e}function m(e,r,t){return(r=function(e){var r=function(e,r){if("object"!==n(e)||null===e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var a=t.call(e,r||"default");if("object"!==n(a))return a;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===r?String:Number)(e)}(e,"string");return"symbol"===n(r)?r:String(r)}(r))in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}var o={marginRight:3,top:2,display:"inline-flex"};return function(){return r.default.createElement("div",null,r.default.createElement(a.Breadcrumb,null,r.default.createElement(a.Breadcrumb.Item,null,r.default.createElement("a",{href:"#"},r.default.createElement(a.Icon,{style:o,type:"home"}))),r.default.createElement(a.Breadcrumb.Item,{separator:">"},r.default.createElement("a",{href:"#"},r.default.createElement(a.Icon,{style:o,type:"apple"}),"Library")),r.default.createElement(a.Breadcrumb.Item,{separator:">"},r.default.createElement("a",{href:"#"},r.default.createElement(a.Icon,{style:o,type:"pie-chart"}),"Chart")),r.default.createElement(a.Breadcrumb.Item,{separator:""},r.default.createElement("a",{href:"#"},r.default.createElement(a.Icon,{style:c(c({},o),{},{marginRight:0}),type:"star-on"})," Chart")),r.default.createElement(a.Breadcrumb.Item,{separator:"",active:!0},"Data")))}}()},data:{21:{name:21,meta:{},code:'"use strict";\n\nvar _react = _interopRequireDefault(require("react"));\nvar _uiw = require("uiw");\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\nreturn function Demo() {\n  return /*#__PURE__*/_react["default"].createElement(_uiw.Breadcrumb, null, /*#__PURE__*/_react["default"].createElement(_uiw.Breadcrumb.Item, null, "\\u9996\\u9875"), /*#__PURE__*/_react["default"].createElement(_uiw.Breadcrumb.Item, {\n    separator: ">"\n  }, "\\u6D3B\\u52A8\\u7BA1\\u7406"), /*#__PURE__*/_react["default"].createElement(_uiw.Breadcrumb.Item, null, "\\u6D3B\\u52A8\\u5217\\u8868"), /*#__PURE__*/_react["default"].createElement(_uiw.Breadcrumb.Item, {\n    active: true\n  }, "\\u6D3B\\u52A8\\u8BE6\\u60C5"));\n};',language:"jsx",value:"import React from 'react';\nimport { Breadcrumb } from 'uiw';\n\nexport default function Demo() {\n  return(\n    <Breadcrumb>\n      <Breadcrumb.Item>\u9996\u9875</Breadcrumb.Item>\n      <Breadcrumb.Item separator=\">\">\u6d3b\u52a8\u7ba1\u7406</Breadcrumb.Item>\n      <Breadcrumb.Item>\u6d3b\u52a8\u5217\u8868</Breadcrumb.Item>\n      <Breadcrumb.Item active>\u6d3b\u52a8\u8be6\u60c5</Breadcrumb.Item>\n    </Breadcrumb>\n  );\n}"},41:{name:41,meta:{},code:'"use strict";\n\nvar _react = _interopRequireDefault(require("react"));\nvar _uiw = require("uiw");\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\nreturn function Demo() {\n  return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_uiw.Breadcrumb, null, /*#__PURE__*/_react["default"].createElement(_uiw.Breadcrumb.Item, null, /*#__PURE__*/_react["default"].createElement("a", {\n    href: "#"\n  }, "Home")), /*#__PURE__*/_react["default"].createElement(_uiw.Breadcrumb.Item, {\n    separator: ">"\n  }, /*#__PURE__*/_react["default"].createElement("a", {\n    href: "#"\n  }, "Library")), /*#__PURE__*/_react["default"].createElement(_uiw.Breadcrumb.Item, {\n    active: true\n  }, "Data")), /*#__PURE__*/_react["default"].createElement(_uiw.Divider, null), /*#__PURE__*/_react["default"].createElement(_uiw.Breadcrumb, {\n    separator: "#"\n  }, /*#__PURE__*/_react["default"].createElement(_uiw.Breadcrumb.Item, null, /*#__PURE__*/_react["default"].createElement("a", {\n    href: "#"\n  }, "Home")), /*#__PURE__*/_react["default"].createElement(_uiw.Breadcrumb.Item, {\n    separator: /*#__PURE__*/_react["default"].createElement("span", null, "+")\n  }, /*#__PURE__*/_react["default"].createElement("a", {\n    href: "#"\n  }, "Home")), /*#__PURE__*/_react["default"].createElement(_uiw.Breadcrumb.Item, {\n    separator: /*#__PURE__*/_react["default"].createElement(_uiw.Icon, {\n      type: "home",\n      verticalAlign: "baseline"\n    })\n  }, /*#__PURE__*/_react["default"].createElement("a", {\n    href: "#"\n  }, "Icon")), /*#__PURE__*/_react["default"].createElement(_uiw.Breadcrumb.Item, {\n    separator: ">"\n  }, /*#__PURE__*/_react["default"].createElement("a", {\n    href: "#"\n  }, "Library")), /*#__PURE__*/_react["default"].createElement(_uiw.Breadcrumb.Item, {\n    active: true\n  }, "Data")));\n};',language:"jsx",value:'import React from \'react\';\nimport { Breadcrumb, Divider, Icon } from \'uiw\';\n\nexport default function Demo() {\n  return(\n    <div>\n      <Breadcrumb>\n        <Breadcrumb.Item><a href="#">Home</a></Breadcrumb.Item>\n        <Breadcrumb.Item separator=">"><a href="#">Library</a></Breadcrumb.Item>\n        <Breadcrumb.Item active>Data</Breadcrumb.Item>\n      </Breadcrumb>\n      <Divider />\n      <Breadcrumb separator="#">\n        <Breadcrumb.Item><a href="#">Home</a></Breadcrumb.Item>\n        <Breadcrumb.Item separator={<span>+</span>}><a href="#">Home</a></Breadcrumb.Item>\n        <Breadcrumb.Item separator={<Icon type="home" verticalAlign="baseline" />}><a href="#">Icon</a></Breadcrumb.Item>\n        <Breadcrumb.Item separator=">"><a href="#">Library</a></Breadcrumb.Item>\n        <Breadcrumb.Item active>Data</Breadcrumb.Item>\n      </Breadcrumb>\n    </div>\n  );\n}'},70:{name:70,meta:{},code:'"use strict";\n\nvar _react = _interopRequireDefault(require("react"));\nvar _uiw = require("uiw");\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\nfunction _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }\nfunction _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }\nvar stylIcon = {\n  marginRight: 3,\n  top: 2,\n  display: \'inline-flex\'\n};\nreturn function Demo() {\n  return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_uiw.Breadcrumb, null, /*#__PURE__*/_react["default"].createElement(_uiw.Breadcrumb.Item, null, /*#__PURE__*/_react["default"].createElement("a", {\n    href: "#"\n  }, /*#__PURE__*/_react["default"].createElement(_uiw.Icon, {\n    style: stylIcon,\n    type: "home"\n  }))), /*#__PURE__*/_react["default"].createElement(_uiw.Breadcrumb.Item, {\n    separator: ">"\n  }, /*#__PURE__*/_react["default"].createElement("a", {\n    href: "#"\n  }, /*#__PURE__*/_react["default"].createElement(_uiw.Icon, {\n    style: stylIcon,\n    type: "apple"\n  }), "Library")), /*#__PURE__*/_react["default"].createElement(_uiw.Breadcrumb.Item, {\n    separator: ">"\n  }, /*#__PURE__*/_react["default"].createElement("a", {\n    href: "#"\n  }, /*#__PURE__*/_react["default"].createElement(_uiw.Icon, {\n    style: stylIcon,\n    type: "pie-chart"\n  }), "Chart")), /*#__PURE__*/_react["default"].createElement(_uiw.Breadcrumb.Item, {\n    separator: ""\n  }, /*#__PURE__*/_react["default"].createElement("a", {\n    href: "#"\n  }, /*#__PURE__*/_react["default"].createElement(_uiw.Icon, {\n    style: _objectSpread(_objectSpread({}, stylIcon), {}, {\n      marginRight: 0\n    }),\n    type: "star-on"\n  }), " Chart")), /*#__PURE__*/_react["default"].createElement(_uiw.Breadcrumb.Item, {\n    separator: "",\n    active: true\n  }, "Data")));\n};',language:"jsx",value:'import React from \'react\';\nimport { Breadcrumb, Icon } from \'uiw\';\n\nconst stylIcon = { marginRight: 3, top: 2, display: \'inline-flex\' }\n\nexport default function Demo() {\n  return(\n    <div>\n      <Breadcrumb>\n        <Breadcrumb.Item>\n          <a href="#"><Icon style={stylIcon} type="home"/></a>\n        </Breadcrumb.Item>\n        <Breadcrumb.Item separator=">">\n          <a href="#"><Icon style={stylIcon} type="apple"/>Library</a>\n        </Breadcrumb.Item>\n        <Breadcrumb.Item separator=">">\n          <a href="#"><Icon style={stylIcon} type="pie-chart"/>Chart</a>\n        </Breadcrumb.Item>\n        <Breadcrumb.Item separator="">\n          <a href="#"><Icon style={{...stylIcon, marginRight: 0}} type="star-on"/> Chart</a>\n        </Breadcrumb.Item>\n        <Breadcrumb.Item separator="" active>Data</Breadcrumb.Item>\n      </Breadcrumb>\n    </div>\n  );\n}'}},source:'Breadcrumb \u9762\u5305\u5c51\n===\n\n[![Buy me a coffee](https://img.shields.io/badge/Buy%20me%20a%20coffee-048754?logo=buymeacoffee)](https://jaywcjlove.github.io/#/sponsor)\n[![Open in unpkg](https://img.shields.io/badge/Open%20in-unpkg-blue)](https://uiwjs.github.io/npm-unpkg/#/pkg/@uiw/react-breadcrumb/file/README.md)\n[![NPM Downloads](https://img.shields.io/npm/dm/@uiw/react-breadcrumb.svg?style=flat)](https://www.npmjs.com/package/@uiw/react-breadcrumb)\n[![npm version](https://img.shields.io/npm/v/@uiw/react-breadcrumb.svg?label=@uiw/react-breadcrumb)](https://npmjs.com/@uiw/react-breadcrumb)\n\n\u663e\u793a\u5f53\u524d\u9875\u9762\u7684\u8def\u5f84\uff0c\u5feb\u901f\u8fd4\u56de\u4e4b\u524d\u7684\u4efb\u610f\u9875\u9762\u3002\n\n```jsx\nimport { Breadcrumb } from \'uiw\';\n// or\nimport Breadcrumb from \'@uiw/react-breadcrumb\';\n```\n\n### \u57fa\u7840\u7528\u6cd5\n\n\u9002\u7528\u5e7f\u6cdb\u7684\u57fa\u7840\u7528\u6cd5\uff0c\u5728 `Breadcrumb` \u4e2d\u4f7f\u7528 `Breadcrumb.Item` \u6807\u7b7e\u8868\u793a\u4ece\u9996\u9875\u5f00\u59cb\u7684\u6bcf\u4e00\u7ea7\u3002\n\n```jsx mdx:preview\nimport React from \'react\';\nimport { Breadcrumb } from \'uiw\';\n\nexport default function Demo() {\n  return(\n    <Breadcrumb>\n      <Breadcrumb.Item>\u9996\u9875</Breadcrumb.Item>\n      <Breadcrumb.Item separator=">">\u6d3b\u52a8\u7ba1\u7406</Breadcrumb.Item>\n      <Breadcrumb.Item>\u6d3b\u52a8\u5217\u8868</Breadcrumb.Item>\n      <Breadcrumb.Item active>\u6d3b\u52a8\u8be6\u60c5</Breadcrumb.Item>\n    </Breadcrumb>\n  );\n}\n```\n\n### \u81ea\u5b9a\u4e49\u5206\u9694\u7b26\n\n\u4f7f\u7528 `separator=">"` \u53ef\u4ee5\u81ea\u5b9a\u4e49\u5206\u9694\u7b26\uff0c\u5206\u9694\u7b26\u4e5f\u53ef\u4ee5\u662f\u56fe\u6807\u3002\n\n```jsx mdx:preview\nimport React from \'react\';\nimport { Breadcrumb, Divider, Icon } from \'uiw\';\n\nexport default function Demo() {\n  return(\n    <div>\n      <Breadcrumb>\n        <Breadcrumb.Item><a href="#">Home</a></Breadcrumb.Item>\n        <Breadcrumb.Item separator=">"><a href="#">Library</a></Breadcrumb.Item>\n        <Breadcrumb.Item active>Data</Breadcrumb.Item>\n      </Breadcrumb>\n      <Divider />\n      <Breadcrumb separator="#">\n        <Breadcrumb.Item><a href="#">Home</a></Breadcrumb.Item>\n        <Breadcrumb.Item separator={<span>+</span>}><a href="#">Home</a></Breadcrumb.Item>\n        <Breadcrumb.Item separator={<Icon type="home" verticalAlign="baseline" />}><a href="#">Icon</a></Breadcrumb.Item>\n        <Breadcrumb.Item separator=">"><a href="#">Library</a></Breadcrumb.Item>\n        <Breadcrumb.Item active>Data</Breadcrumb.Item>\n      </Breadcrumb>\n    </div>\n  );\n}\n```\n\n### \u5e26\u6709\u56fe\u6807\u548c\u8fde\u63a5\u7684\n\n\u56fe\u6807\u653e\u5728\u6587\u5b57\u524d\u9762\u3002\u6ce8\u610f\u6587\u5b57\u8981\u4f7f\u7528 `span` \u5305\u88f9\u8d77\u6765\uff0c\u56fe\u6807 `<Icon />` \u9700\u8981\u8ddf `span` \u540c\u7ea7\u3002`Breadcrumb.Item` \u5b9a\u4e49 `href` \u53c2\u6570\u7684\u8bdd\uff0c`Item` \u4e0a\u7684\u53c2\u6570\u5c31\u5168\u90e8\u662f\u8d85\u94fe\u539f\u59cb\u5c5e\u6027\u3002\n\n```jsx mdx:preview\nimport React from \'react\';\nimport { Breadcrumb, Icon } from \'uiw\';\n\nconst stylIcon = { marginRight: 3, top: 2, display: \'inline-flex\' }\n\nexport default function Demo() {\n  return(\n    <div>\n      <Breadcrumb>\n        <Breadcrumb.Item>\n          <a href="#"><Icon style={stylIcon} type="home"/></a>\n        </Breadcrumb.Item>\n        <Breadcrumb.Item separator=">">\n          <a href="#"><Icon style={stylIcon} type="apple"/>Library</a>\n        </Breadcrumb.Item>\n        <Breadcrumb.Item separator=">">\n          <a href="#"><Icon style={stylIcon} type="pie-chart"/>Chart</a>\n        </Breadcrumb.Item>\n        <Breadcrumb.Item separator="">\n          <a href="#"><Icon style={{...stylIcon, marginRight: 0}} type="star-on"/> Chart</a>\n        </Breadcrumb.Item>\n        <Breadcrumb.Item separator="" active>Data</Breadcrumb.Item>\n      </Breadcrumb>\n    </div>\n  );\n}\n```\n\n## Breadcrumb\n\n| \u53c2\u6570 | \u8bf4\u660e | \u7c7b\u578b | \u9ed8\u8ba4\u503c |\n|--------- |-------- |--------- |-------- |\n| style | \u6837\u5f0f | String | - |\n| className | \u6837\u5f0f\u540d\u79f0 | String | `w-breadcrumb` |\n| tagName | \u8bbe\u7f6e\u5b50\u8282\u70b9\u6807\u7b7e\u540d\uff0c\u9ed8\u8ba4 `<a />` \u6807\u7b7e\uff0c\u4e5f\u53ef\u4ee5\u6307\u5b9a\u8def\u7531 [`<Link />`](https://reacttraining.com/react-router/web/api/Link) | String | `a` |\n| separator | \u5206\u9694\u7b26\u81ea\u5b9a\u4e49\uff0c\u5b9a\u4e49\u6240\u6709\u5b50\u7ec4\u4ef6\u7684\u5206\u9694\u7b26\u3002 | String | `/` |\n\n\u5176\u5b83\u53c2\u6570\u53ef\u6839\u636e `tagName` \u6765\u8bbe\u7f6e\uff0c\u9ed8\u8ba4 `<a />` \u6807\u7b7e\u65f6\uff0c\u53ef\u8bbe\u7f6e `href="https://wwww.google.com"` \u6216\u8005 `target="_blank"` \u7b49\u53c2\u6570\uff0c\u4f60\u53ef\u4ee5\u8bbe\u7f6e [react-router-dom](https://github.com/ReactTraining/react-router) \u8def\u7531 [`<Link />`](https://reacttraining.com/react-router/web/api/Link)\uff0c\u4f8b\u5982\uff1a\n\n```jsx\nimport { Breadcrumb, Icon } from \'uiw\';\nimport { Link } from \'react-router-dom\';\n\nconst Demo = () => {\n  return (\n    <Breadcrumb>\n      <Breadcrumb.Item tagName={Link} to="/home">\n        <Icon type="apple"/> Home\n      </Breadcrumb.Item>\n    </Breadcrumb>\n  )\n}\n```\n\n## Breadcrumb.Item\n\n| \u53c2\u6570 | \u8bf4\u660e | \u7c7b\u578b | \u9ed8\u8ba4\u503c |\n|--------- |-------- |--------- |-------- |\n| className | \u6837\u5f0f\u540d\u79f0 | String | `w-breadcrumb-itme` |\n| separator | \u5206\u9694\u7b26\u81ea\u5b9a\u4e49\uff0c\u5b50\u7ec4\u4ef6\u53ef\u4ee5\u5355\u72ec\u5b9a\u4e49\u4e0d\u540c\u7684\u5206\u9694\u7b26\u3002 | String | - |\n| active | \u6fc0\u6d3b\u3002 | String | - |\n\n',headings:[],headingsList:[]};var n=t(5301),u=t(4760);function c(){return(0,u.jsx)(n.Z,{...a,path:"https://github.com/uiwjs/uiw/tree/master/packages/react-breadcrumb/README.md"})}}}]);
//# sourceMappingURL=5740.4ccc8290.chunk.js.map