Skip to content

Commit 83786be

Browse files
committed
fix: add PageHeaderWrapper tags, title slot
1 parent d65c447 commit 83786be

File tree

2 files changed

+24
-4
lines changed

2 files changed

+24
-4
lines changed

examples/src/views/form/basic-form.vue

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,13 @@
1414
console.log('PageHeader::.back')
1515
}"
1616
>
17+
<template v-slot:title>
18+
自定义标题
19+
</template>
20+
<template v-slot:tags>
21+
<a-tag color="pink">tag1</a-tag>
22+
<a-tag>tag2</a-tag>
23+
</template>
1724
<template v-slot:content>
1825
<span>{{ $t('pages.form.basicform.content') }}</span>
1926
</template>

src/components/PageHeaderWrapper/index.jsx

Lines changed: 17 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,15 @@
11
import './index.less'
22

33
import PropTypes from 'ant-design-vue/es/_util/vue-types'
4+
import { isArray } from 'ant-design-vue/lib/_util/vue-types/utils'
45
import GridContent from '../GridContent'
56
import 'ant-design-vue/es/page-header/style'
67
import PageHeader, { PageHeaderProps } from 'ant-design-vue/es/page-header'
78
import 'ant-design-vue/es/tabs/style'
89
import Tabs from 'ant-design-vue/es/tabs'
910
import { getComponentFromProp } from 'ant-design-vue/lib/_util/props-util'
1011

12+
1113
const prefixedClassName = 'ant-pro-page-header-wrap'
1214

1315
const PageHeaderTabConfig = {
@@ -94,7 +96,8 @@ const renderPageHeader = (h, content, extraContent) => {
9496

9597
const defaultPageHeaderRender = (h, props, pageMeta, i18nRender) => {
9698
const {
97-
title,
99+
title: propTitle,
100+
tags,
98101
content,
99102
pageHeaderRender,
100103
extra,
@@ -106,14 +109,20 @@ const defaultPageHeaderRender = (h, props, pageMeta, i18nRender) => {
106109
if (pageHeaderRender) {
107110
return pageHeaderRender({ ...props })
108111
}
109-
let pageHeaderTitle = title
110-
if (!title && title !== false) {
112+
let pageHeaderTitle = propTitle
113+
if (!propTitle && propTitle !== false) {
111114
pageHeaderTitle = pageMeta.title
112115
}
116+
// title props 不是 false 且不是 array 则直接渲染 title
117+
// 反之认为是 VNode, 作为 render 参数直接传入到 PageHeader
118+
const title = isArray(pageHeaderTitle)
119+
? pageHeaderTitle
120+
: pageHeaderTitle && i18nRender(pageHeaderTitle)
113121
let tabProps = {
114122
breadcrumb,
115123
extra,
116-
title: pageHeaderTitle && i18nRender(pageHeaderTitle),
124+
tags,
125+
title,
117126
footer: renderFooter(h, restProps, i18nRender),
118127
}
119128
if (!handleBack) {
@@ -135,6 +144,8 @@ const PageHeaderWrapper = {
135144
render(h) {
136145
const { $route, $listeners } = this
137146
const children = this.$slots.default
147+
const title = getComponentFromProp(this, 'title')
148+
const tags = getComponentFromProp(this, 'tags')
138149
const content = getComponentFromProp(this, 'content')
139150
const extra = getComponentFromProp(this, 'extra')
140151
const extraContent = getComponentFromProp(this, 'extraContent')
@@ -186,6 +197,8 @@ const PageHeaderWrapper = {
186197

187198
const props = {
188199
...this.$props,
200+
title,
201+
tags,
189202
content,
190203
extra,
191204
extraContent,

0 commit comments

Comments
 (0)