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

fix: descriptionsItem labelStyle not work, close #5920

pull/5937/head
tangjinzhou 2022-09-01 16:11:01 +08:00
parent d48cd8ef57
commit 0f11e4ecd4
1 changed files with 16 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
components/descriptions/Row.tsx
View File

@ -1,8 +1,7 @@
import Cell from './Cell'; import Cell from './Cell';
import { getSlot, getClass, getStyle } from '../_util/props-util'; import { getSlot, getClass, getStyle } from '../_util/props-util';
import type { FunctionalComponent, VNode } from 'vue'; import type { CSSProperties, FunctionalComponent, VNode } from 'vue';
import { inject, ref } from 'vue'; import { inject, ref } from 'vue';
import type { DescriptionsContextProp } from './index';
import { descriptionsContext } from './index'; import { descriptionsContext } from './index';
interface CellConfig { interface CellConfig {
@ -32,29 +31,29 @@ const Row: FunctionalComponent<RowProps> = props => {
showContent, showContent,
labelStyle: rootLabelStyle, labelStyle: rootLabelStyle,
contentStyle: rootContentStyle, contentStyle: rootContentStyle,
}: CellConfig & DescriptionsContextProp, }: CellConfig & { labelStyle?: CSSProperties; contentStyle?: CSSProperties },
) => { ) => {
return items.map((item, index) => { return items.map((item, index) => {
const itemProps = item.props || {};
const { const {
prefixCls: itemPrefixCls = prefixCls, prefixCls: itemPrefixCls = prefixCls,
span = 1, span = 1,
labelStyle, labelStyle = itemProps['label-style'],
contentStyle, contentStyle = itemProps['content-style'],
label = (item.children as any)?.label?.(), label = (item.children as any)?.label?.(),
} = item.props || {}; } = itemProps;
const children = getSlot(item); const children = getSlot(item);
const className = getClass(item); const className = getClass(item);
const style = getStyle(item); const style = getStyle(item);
const { key } = item; const { key } = item;
if (typeof component === 'string') { if (typeof component === 'string') {
return ( return (
<Cell <Cell
key={`${type}-${String(key) || index}`} key={`${type}-${String(key) || index}`}
class={className} class={className}
style={style} style={style}
labelStyle={{ ...rootLabelStyle.value, ...labelStyle }} labelStyle={{ ...rootLabelStyle, ...labelStyle }}
contentStyle={{ ...rootContentStyle.value, ...contentStyle }} contentStyle={{ ...rootContentStyle, ...contentStyle }}
span={span} span={span}
colon={colon} colon={colon}
component={component} component={component}
@ -70,7 +69,7 @@ const Row: FunctionalComponent<RowProps> = props => {
<Cell <Cell
key={`label-${String(key) || index}`} key={`label-${String(key) || index}`}
class={className} class={className}
style={{ ...rootLabelStyle.value, ...style, ...labelStyle }} style={{ ...rootLabelStyle, ...style, ...labelStyle }}
span={1} span={1}
colon={colon} colon={colon}
component={component[0]} component={component[0]}
@ -81,7 +80,7 @@ const Row: FunctionalComponent<RowProps> = props => {
<Cell <Cell
key={`content-${String(key) || index}`} key={`content-${String(key) || index}`}
class={className} class={className}
style={{ ...rootContentStyle.value, ...style, ...contentStyle }} style={{ ...rootContentStyle, ...style, ...contentStyle }}
span={span * 2 - 1} span={span * 2 - 1}
component={component[1]} component={component[1]}
itemPrefixCls={itemPrefixCls} itemPrefixCls={itemPrefixCls}
@ -105,8 +104,8 @@ const Row: FunctionalComponent<RowProps> = props => {
component: 'th', component: 'th',
type: 'label', type: 'label',
showLabel: true, showLabel: true,
labelStyle, labelStyle: labelStyle.value,
contentStyle, contentStyle: contentStyle.value,
})} })}
</tr> </tr>
<tr key={`content-${index}`} class={`${prefixCls}-row`}> <tr key={`content-${index}`} class={`${prefixCls}-row`}>
@ -114,8 +113,8 @@ const Row: FunctionalComponent<RowProps> = props => {
component: 'td', component: 'td',
type: 'content', type: 'content',
showContent: true, showContent: true,
labelStyle, labelStyle: labelStyle.value,
contentStyle, contentStyle: contentStyle.value,
})} })}
</tr> </tr>
</> </>
@ -129,8 +128,8 @@ const Row: FunctionalComponent<RowProps> = props => {
type: 'item', type: 'item',
showLabel: true, showLabel: true,
showContent: true, showContent: true,
labelStyle, labelStyle: labelStyle.value,
contentStyle, contentStyle: contentStyle.value,
})} })}
</tr> </tr>
); );