From 9faaa8464e1d2c08f950ac794d1c050b65915dc7 Mon Sep 17 00:00:00 2001 From: xrkffgg Date: Thu, 4 Jun 2020 17:19:51 +0800 Subject: [PATCH 1/3] feat: update pageheader --- components/page-header/index.jsx | 29 +++++++++++++++-------------- examples/index.js | 3 +++ 2 files changed, 18 insertions(+), 14 deletions(-) diff --git a/components/page-header/index.jsx b/components/page-header/index.jsx index 4f317c00fd..94a50dec33 100644 --- a/components/page-header/index.jsx +++ b/components/page-header/index.jsx @@ -1,12 +1,12 @@ +import { inject } from 'vue'; import PropTypes from '../_util/vue-types'; -import { getComponentFromProp, getOptionProps } from '../_util/props-util'; +import { getComponent, getOptionProps } from '../_util/props-util'; import { ConfigConsumerProps } from '../config-provider'; import ArrowLeftOutlined from '@ant-design/icons-vue/ArrowLeftOutlined'; import Breadcrumb from '../breadcrumb'; import Avatar from '../avatar'; import TransButton from '../_util/transButton'; import LocaleReceiver from '../locale-provider/LocaleReceiver'; -import Base from '../base'; export const PageHeaderProps = { backIcon: PropTypes.any, @@ -52,13 +52,13 @@ const renderBreadcrumb = (h, breadcrumb) => { const renderTitle = (h, prefixCls, instance) => { const { avatar } = instance; - const title = getComponentFromProp(instance, 'title'); - const subTitle = getComponentFromProp(instance, 'subTitle'); - const tags = getComponentFromProp(instance, 'tags'); - const extra = getComponentFromProp(instance, 'extra'); + const title = getComponent(instance, 'title'); + const subTitle = getComponent(instance, 'subTitle'); + const tags = getComponent(instance, 'tags'); + const extra = getComponent(instance, 'extra'); const backIcon = - getComponentFromProp(instance, 'backIcon') !== undefined ? ( - getComponentFromProp(instance, 'backIcon') + getComponent(instance, 'backIcon') !== undefined ? ( + getComponent(instance, 'backIcon') ) : ( ); @@ -94,14 +94,16 @@ const renderChildren = (h, prefixCls, children) => { const PageHeader = { name: 'APageHeader', props: PageHeaderProps, - inject: { - configProvider: { default: () => ConfigConsumerProps }, + setup() { + return { + configProvider: inject('configProvider', ConfigConsumerProps), + }; }, render(h) { const { getPrefixCls, pageHeader } = this.configProvider; const props = getOptionProps(this); const { prefixCls: customizePrefixCls, breadcrumb } = props; - const footer = getComponentFromProp(this, 'footer'); + const footer = getComponent(this, 'footer'); const children = this.$slots.default; let ghost = true; @@ -138,9 +140,8 @@ const PageHeader = { }; /* istanbul ignore next */ -PageHeader.install = function(Vue) { - Vue.use(Base); - Vue.component(PageHeader.name, PageHeader); +PageHeader.install = function(app) { + app.component(PageHeader.name, PageHeader); }; export default PageHeader; diff --git a/examples/index.js b/examples/index.js index 3993276a94..666c0141bc 100644 --- a/examples/index.js +++ b/examples/index.js @@ -10,6 +10,8 @@ import Divider from 'ant-design-vue/divider'; import ConfigProvider from 'ant-design-vue/config-provider'; import Result from 'ant-design-vue/result'; import Spin from 'ant-design-vue/spin'; +import PageHeader from 'ant-design-vue/page-header'; +import Spin from 'ant-design-vue/Spin'; import Empty from 'ant-design-vue/empty'; import Timeline from 'ant-design-vue/timeline'; import 'ant-design-vue/style.js'; @@ -23,6 +25,7 @@ createApp(App) .use(Alert) .use(Divider) .use(Result) + .use(PageHeader) .use(Spin) .use(Empty) .use(Timeline) From d6ab44bbf3a6f5b427997ae2c5b95c302c36c938 Mon Sep 17 00:00:00 2001 From: xrkffgg Date: Mon, 8 Jun 2020 15:30:50 +0800 Subject: [PATCH 2/3] fix: error --- components/page-header/index.jsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/components/page-header/index.jsx b/components/page-header/index.jsx index 94a50dec33..814dca72ea 100644 --- a/components/page-header/index.jsx +++ b/components/page-header/index.jsx @@ -62,7 +62,7 @@ const renderTitle = (h, prefixCls, instance) => { ) : ( ); - const onBack = instance.$listeners.back; + const onBack = instance.$attrs.onBack; const headingPrefixCls = `${prefixCls}-heading`; if (title || subTitle || tags || extra) { const backIconDom = renderBack(instance, prefixCls, backIcon, onBack); @@ -104,7 +104,7 @@ const PageHeader = { const props = getOptionProps(this); const { prefixCls: customizePrefixCls, breadcrumb } = props; const footer = getComponent(this, 'footer'); - const children = this.$slots.default; + const children = this.$slots.default && this.$slots.default(); let ghost = true; From f1384c5f0a27d0bab317b8612dc85b3445813377 Mon Sep 17 00:00:00 2001 From: xrkffgg Date: Mon, 8 Jun 2020 15:33:29 +0800 Subject: [PATCH 3/3] fix: index --- examples/index.js | 1 - 1 file changed, 1 deletion(-) diff --git a/examples/index.js b/examples/index.js index 666c0141bc..29f09032d1 100644 --- a/examples/index.js +++ b/examples/index.js @@ -11,7 +11,6 @@ import ConfigProvider from 'ant-design-vue/config-provider'; import Result from 'ant-design-vue/result'; import Spin from 'ant-design-vue/spin'; import PageHeader from 'ant-design-vue/page-header'; -import Spin from 'ant-design-vue/Spin'; import Empty from 'ant-design-vue/empty'; import Timeline from 'ant-design-vue/timeline'; import 'ant-design-vue/style.js';