ant-design/components/breadcrumb/demo/overlay.md
偏右 6d2a5df1e6 fix: Breadcrumb validateDOMNesting warning (#16929)
* 🐛 Fix Breadcrumb validateDOMNesting warning

```
Warning: validateDOMNesting(...): <a> cannot appear as a descendant of <a>.
    in a (created by Context.Consumer)
    in span (created by Context.Consumer)
    in a (created by Context.Consumer)
    in Trigger (created by Dropdown)
    in Dropdown (created by Context.Consumer)
    in Dropdown (created by Context.Consumer)
    in span (created by Context.Consumer)
    in BreadcrumbItem (created by Context.Consumer)
    in div (created by Context.Consumer)
    in Breadcrumb (created by TestBreadcrumb)
    in TestBreadcrumb
```

*  update snapshots
2019-06-03 16:13:15 +08:00

53 lines
1.0 KiB
Markdown

---
order: 5
title:
zh-CN: 带下拉菜单的面包屑
en-US: Bread crumbs with drop down menu
---
## zh-CN
面包屑支持下拉菜单。
## en-US
Breadcrumbs support drop down menu.
```jsx
import { Breadcrumb, Menu } from 'antd';
const menu = (
<Menu>
<Menu.Item>
<a target="_blank" rel="noopener noreferrer" href="http://www.alipay.com/">
General
</a>
</Menu.Item>
<Menu.Item>
<a target="_blank" rel="noopener noreferrer" href="http://www.taobao.com/">
Layout
</a>
</Menu.Item>
<Menu.Item>
<a target="_blank" rel="noopener noreferrer" href="http://www.tmall.com/">
Navigation
</a>
</Menu.Item>
</Menu>
);
ReactDOM.render(
<Breadcrumb>
<Breadcrumb.Item>Ant Design</Breadcrumb.Item>
<Breadcrumb.Item>
<a href="">Component</a>
</Breadcrumb.Item>
<Breadcrumb.Item overlay={menu}>
<a href="">General</a>
</Breadcrumb.Item>
<Breadcrumb.Item>Button</Breadcrumb.Item>
</Breadcrumb>,
mountNode,
);
```