mirror of
https://github.com/ant-design/ant-design.git
synced 2025-06-08 01:53:34 +08:00
hidden breadcrumb href in Doc
This commit is contained in:
parent
7d3ce97cc8
commit
921d3bce46
@ -2,7 +2,7 @@
|
|||||||
|
|
||||||
- order: 0
|
- order: 0
|
||||||
|
|
||||||
最简单的用法,存在 `href` 表示可点。
|
最简单的用法。
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
@ -12,8 +12,8 @@ import { Breadcrumb } from 'antd';
|
|||||||
ReactDOM.render(
|
ReactDOM.render(
|
||||||
<Breadcrumb>
|
<Breadcrumb>
|
||||||
<Breadcrumb.Item>首页</Breadcrumb.Item>
|
<Breadcrumb.Item>首页</Breadcrumb.Item>
|
||||||
<Breadcrumb.Item href="">应用中心</Breadcrumb.Item>
|
<Breadcrumb.Item><a href="">应用中心</a></Breadcrumb.Item>
|
||||||
<Breadcrumb.Item href="">应用列表</Breadcrumb.Item>
|
<Breadcrumb.Item><a href="">应用列表</a></Breadcrumb.Item>
|
||||||
<Breadcrumb.Item>某应用</Breadcrumb.Item>
|
<Breadcrumb.Item>某应用</Breadcrumb.Item>
|
||||||
</Breadcrumb>
|
</Breadcrumb>
|
||||||
, mountNode);
|
, mountNode);
|
||||||
|
@ -17,10 +17,12 @@ class BreadcrumbItem extends React.Component {
|
|||||||
}
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { prefixCls, separator, children } = this.props;
|
const { prefixCls, separator, children, ...restProps } = this.props;
|
||||||
let link = <a className={`${prefixCls}-link`} {...this.props}>{children}</a>;
|
let link;
|
||||||
if (typeof this.props.href === 'undefined') {
|
if ('href' in this.props) {
|
||||||
link = <span className={`${prefixCls}-link`} {...this.props}>{children}</span>;
|
link = <a className={`${prefixCls}-link`} {...restProps}>{children}</a>;
|
||||||
|
} else {
|
||||||
|
link = <span className={`${prefixCls}-link`} {...restProps}>{children}</span>;
|
||||||
}
|
}
|
||||||
return (
|
return (
|
||||||
<span>
|
<span>
|
||||||
|
@ -19,23 +19,15 @@
|
|||||||
```html
|
```html
|
||||||
<Breadcrumb>
|
<Breadcrumb>
|
||||||
<Breadcrumb.Item>首页</Breadcrumb.Item>
|
<Breadcrumb.Item>首页</Breadcrumb.Item>
|
||||||
<Breadcrumb.Item href="">应用中心</Breadcrumb.Item>
|
<Breadcrumb.Item>应用中心</Breadcrumb.Item>
|
||||||
<Breadcrumb.Item href="">应用列表</Breadcrumb.Item>
|
<Breadcrumb.Item>应用列表</Breadcrumb.Item>
|
||||||
<Breadcrumb.Item>某应用</Breadcrumb.Item>
|
<Breadcrumb.Item>某应用</Breadcrumb.Item>
|
||||||
</Breadcrumb>
|
</Breadcrumb>
|
||||||
```
|
```
|
||||||
|
|
||||||
### Breadcrumb
|
|
||||||
|
|
||||||
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|
||||||
|-----------|-----------------------------------|-------------------|---------|--------|
|
|-----------|-----------------------------------|-------------------|---------|--------|
|
||||||
| routes | router 的路由栈信息 | Array | | - |
|
| routes | router 的路由栈信息 | Array | | - |
|
||||||
| params | 路由的参数 | Object | | - |
|
| params | 路由的参数 | Object | | - |
|
||||||
| separator | 分隔符自定义 | String or Element | | '/' |
|
| separator | 分隔符自定义 | String or Element | | '/' |
|
||||||
| linkRender | 自定义链接函数,和 react-router 配置使用 | Function(href, name) | | - |
|
| linkRender | 自定义链接函数,和 react-router 配置使用 | Function(href, name) | | - |
|
||||||
|
|
||||||
### Breadcrumb.Item
|
|
||||||
|
|
||||||
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|
|
||||||
|-----------|------------------------------------------|------------|---------|--------|
|
|
||||||
| href | 链接,如不传则不可点击 | string | | - |
|
|
||||||
|
@ -2,15 +2,15 @@
|
|||||||
|
|
||||||
.@{breadcrumb-prefix-cls} {
|
.@{breadcrumb-prefix-cls} {
|
||||||
color: #999;
|
color: #999;
|
||||||
font-size: 12px;
|
font-size: @font-size-base;
|
||||||
|
|
||||||
a {
|
a {
|
||||||
color: #666;
|
color: @text-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
& > span:last-child {
|
& > span:last-child {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
color: #666;
|
color: @text-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
& > span:last-child &-separator {
|
& > span:last-child &-separator {
|
||||||
|
Loading…
Reference in New Issue
Block a user