github
/
ant-design-vue
mirror of https://github.com/vueComponent/ant-design-vue
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

perf: udpate breadcrumb

pull/2439/head
tanjinzhou 2020-06-22 18:25:57 +08:00
parent e6b182474d
commit cdefb49580
3 changed files with 12 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
components/breadcrumb/Breadcrumb.jsx
View File

@ -1,6 +1,6 @@
import { inject, cloneVNode } from 'vue'; import { inject, cloneVNode, createVNode } from 'vue';
import PropTypes from '../_util/vue-types'; import PropTypes from '../_util/vue-types';
import { filterEmpty, getComponent, getSlotOptions, getSlot } from '../_util/props-util'; import { filterEmpty, getComponent, getSlot } from '../_util/props-util';
import warning from '../_util/warning'; import warning from '../_util/warning';
import { ConfigConsumerProps } from '../config-provider'; import { ConfigConsumerProps } from '../config-provider';
import BreadcrumbItem from './BreadcrumbItem'; import BreadcrumbItem from './BreadcrumbItem';
@ -83,7 +83,7 @@ export default {
params, params,
routes, routes,
paths: this.addChildPath(paths, child.path, params), paths: this.addChildPath(paths, child.path, params),
h: this.$createElement, h: createVNode,
})} })}
</Menu.Item> </Menu.Item>
))} ))}
@ -97,7 +97,7 @@ export default {
separator={separator} separator={separator}
key={route.breadcrumbName || path} key={route.breadcrumbName || path}
> >
{itemRender({ route, params, routes, paths, h: this.$createElement })} {itemRender({ route, params, routes, paths, h: createVNode })}
</BreadcrumbItem> </BreadcrumbItem>
); );
}); });
@ -123,8 +123,8 @@ export default {
} else if (children.length) { } else if (children.length) {
crumbs = children.map((element, index) => { crumbs = children.map((element, index) => {
warning( warning(
getSlotOptions(element).__ANT_BREADCRUMB_ITEM || typeof element.type === 'object' &&
getSlotOptions(element).__ANT_BREADCRUMB_SEPARATOR, (element.type.__ANT_BREADCRUMB_ITEM || element.type.__ANT_BREADCRUMB_SEPARATOR),
'Breadcrumb', 'Breadcrumb',
"Only accepts Breadcrumb.Item and Breadcrumb.Separator as it's children", "Only accepts Breadcrumb.Item and Breadcrumb.Separator as it's children",
); );

6
components/breadcrumb/BreadcrumbItem.jsx
View File

@ -1,6 +1,6 @@
import { inject } from 'vue'; import { inject } from 'vue';
import PropTypes from '../_util/vue-types'; import PropTypes from '../_util/vue-types';
import { hasProp, getComponent } from '../_util/props-util'; import { hasProp, getComponent, getSlot } from '../_util/props-util';
import { ConfigConsumerProps } from '../config-provider'; import { ConfigConsumerProps } from '../config-provider';
import DropDown from '../dropdown/dropdown'; import DropDown from '../dropdown/dropdown';
import DownOutlined from '@ant-design/icons-vue/DownOutlined'; import DownOutlined from '@ant-design/icons-vue/DownOutlined';
@ -40,11 +40,11 @@ export default {
}, },
}, },
render() { render() {
const { prefixCls: customizePrefixCls, $slots } = this; const { prefixCls: customizePrefixCls } = this;
const getPrefixCls = this.configProvider.getPrefixCls; const getPrefixCls = this.configProvider.getPrefixCls;
const prefixCls = getPrefixCls('breadcrumb', customizePrefixCls); const prefixCls = getPrefixCls('breadcrumb', customizePrefixCls);
const separator = getComponent(this, 'separator'); const separator = getComponent(this, 'separator');
const children = $slots.default && $slots.default(); const children = getSlot(this);
let link; let link;
if (hasProp(this, 'href')) { if (hasProp(this, 'href')) {
link = <a class={`${prefixCls}-link`}>{children}</a>; link = <a class={`${prefixCls}-link`}>{children}</a>;

5
components/breadcrumb/BreadcrumbSeparator.jsx
View File

@ -1,6 +1,7 @@
import { inject } from 'vue'; import { inject } from 'vue';
import { ConfigConsumerProps } from '../config-provider'; import { ConfigConsumerProps } from '../config-provider';
import PropTypes from '../_util/vue-types'; import PropTypes from '../_util/vue-types';
import { getSlot } from '../_util/props-util';
export default { export default {
name: 'ABreadcrumbSeparator', name: 'ABreadcrumbSeparator',
@ -14,11 +15,11 @@ export default {
}; };
}, },
render() { render() {
const { prefixCls: customizePrefixCls, $slots } = this; const { prefixCls: customizePrefixCls } = this;
const getPrefixCls = this.configProvider.getPrefixCls; const getPrefixCls = this.configProvider.getPrefixCls;
const prefixCls = getPrefixCls('breadcrumb', customizePrefixCls); const prefixCls = getPrefixCls('breadcrumb', customizePrefixCls);
const children = $slots.default && $slots.default(); const children = getSlot(this);
return <span class={`${prefixCls}-separator`}>{children || '/'}</span>; return <span class={`${prefixCls}-separator`}>{children || '/'}</span>;
}, },
}; };